Hiding field in SharePoint through JavaScript

Hi All,

Many times we require to hide specific field in new form, disp form and edit form. This time we will do it with the help of javascript. We can do the same thing with the help of SharePoint API. However we will cover here that how to achieve the same with the help of JavaScript.

Let us go to calendar and click on new. You will now be on Newform.aspx. We can see here one field named “WorkSpace”. If we don’t want user to create any workspace here, then we can hide this field with the help of JavaScript code.



To hide a specific field, insert one content editor web part on the page and then just copy and paste the following code. Insert this web part below the new form web part.

<script type="text/javascript">
function HideField(title){
var header_h3=document.getElementsByTagName("h3") ;

for(var i = 0; i <header_h3.length; i++)
{
var el = header_h3[i];
var foundField ;
if(el.className=="ms-standardheader")
{
for(var j=0; j<el.childNodes.length; j++)
{
if(el.childNodes[j].innerHTML == title || el.childNodes[j].nodeValue == title)
{
var elRow = el.parentNode.parentNode ;
elRow.style.display = "none"; //and hide the row
foundField = true ;
break;
}
}
}
if(foundField)
break ;
}
}

HideField("Workspace");

</script>

After you’ve inserted this code, just look at the result shown below.



That’s it. Your job is done. You can apply the same code in disp and edit form as well.