Hide fields in New, Display or View forms in SharePoint

One of the limiting factors in using the default forms (NewForm.aspx, EditForm.aspx) is that there is no obvious way to hide columns from appearing in the form.  By default all columns in a list or document library will appear in your forms. 

After doing quite a bit of research on this I found a fairly easy way to hide fields by using JavaScript within the form pages themselves.  In my research I found several different sets of JavaScript code, but some of the scripts are easier to implement than others.  Below I provide the best and most straight forward JavaScript and some simple steps to guide you along.

To hide fields in a SharePoint 2007 form, follow these steps (I will use the NewForm.aspx in my example)

1. Open SharePoint Designer and navigate to the site that contains the list or document library you wish to customize.
   
2. Expand the folder named “Forms” under the desired list or document library.  You should see about seven .aspx pages (AllItems.aspx, EditForm.aspx, NewForm.aspx, etc)
   
3. Open the NewForm.aspx page and switch to the “code” view to edit the HTML of the page.
   
4. Paste the JavaScript code immediately below the the following HTML tag <asp:Content ContentPlaceHolderId=”PlaceHolderMain” runat=”server”>  This will add the JavaScript to the HTML inside the content placeholder tag.  Note: be sure to include the entire script below, including the <script and </script> tags.
   
5. Modify the “hidefields()” section of the JavaScript code to refer to each SharePoint list field name to hide.  For example, the code sample below will hide the SharePoint fields named Title, Document Link, and PublishDate    Notice that you do not need to worry about internal field names or field types like other JavaScript techniques, you simply need to know the name of the field.
   
6. Save the changes.  Select “Yes” when prompted to “…customize the page from the site definition…”
   
7. Test the form

 

<script language="javascript" type="text/javascript">

_spBodyOnLoadFunctionNames.push("hideFields");

function findacontrol(FieldName) {

   var arr = document.getElementsByTagName("!");
   // get all comments
   for (var i=0;i < arr.length; i++ )
   {
      // now match the field name
      if (arr[i].innerHTML.indexOf(FieldName) > 0)
      {         return arr[i];      }
   }
}

function hideFields() {

   var control = findacontrol("Title");
   control.parentNode.parentNode.style.display="none";
   control = findacontrol("Document Link");
   control.parentNode.parentNode.style.display="none";
   control = findacontrol("PublishDate");
   control.parentNode.parentNode.style.display="none";

}
</script>