Monday, July 12, 2010

Modify form labels, Hide or remove columns in SharePoint form

In the CEWP or on the new item page or on the Display.aspx add the following script

<script type="text/javascript" src="http://YourServer/sites/yourSubsite/JQuery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">

fields = init_fields();

var dateTypeLabel = "<div style='color:red'>Please enter the Date Type. (...custom text added by adressing the formlabel with jQuery!)</div>"
var applicationLabel = "<div style='color:red;font-size:9px;'><i>Please enter the Application Name</i></div>";

//Can change more field labels similarly & all the variables defined are the field Internal names


$(fields['DateType']).find(".ms-formlabel h3").after(dateTypeLabel);
$(fields['ApplicationName']).find(".ms-formlabel h3").after(applicationLabel);
// after appends the content whereas .text() changes the existing field label to new label

//Can also append text to labels on hover

//$(fields['DateType']).find(".ms-formlabel h3").hover(
//   function(){     $(fields['DateType']).find(".ms-formlabel h3").append(dateTypeLabel);  },
//   function(){     $(fields['DateType']).find(".ms-formlabel h3").text("DateType");       }
//)

// Hide the Current user label display ( to show only selected labels )
//$(fields['Current_x0020_User']).find(".ms-formlabel h3").parent().parent().hide();
////$(fields['Current_x0020_User']).find(".ms-formlabel h3").parent().parent().hide();

//Set Status(like color,font...) of  Few or Many columns at a time
var arrCFC = ["Col1", "Col2",  "Col3", "Col8", "Col9", "Col12", "Col13", "Col14"];

           //  All these columns, labels here are turned blue
          jQuery.each(arrCFC, function() {
               $(fields[this]).find(".ms-formlabel h3").parent().parent().css("color","Blue");
               $(fields[this]).find(".ms-formlabel h3").css("color","Blue");
  
             });

function init_fields(){
  var res = {};
  $("td.ms-formbody").each(function(){
      if($(this).html().indexOf('FieldInternalName="')<0) return;
      var start = $(this).html().indexOf('FieldInternalName="')+19;
      var stopp = $(this).html().indexOf('FieldType="')-7;
      var nm = $(this).html().substring(start,stopp);
      res[nm] = this.parentNode;
  });
  return res;
}
</script>

Reference:  http://sharepointjavascript.wordpress.com/2009/10/03/modify-formlabel-in-sharepoint-form/
(By Alexander)

No comments: