使用Javascript隱藏/顯示NewForm/EditForm列

在純的SharePoint用戶端開發，考慮到這樣一個需求，你需要操作一個SharePoint List，你建了很多列，但是不是所有的列都希望給終端使用者看到，該怎麼辦？

顯然，只能用JavaScript了。

按照我這個文檔最後提出的一個實踐，你可以做一個給把你的代碼寫到一個HTML檔案中，然後引用你的這個檔案。如所示：

通常情況下，我會把需要引用到的JS檔案放在一個單獨的CEWP中，這樣做的最大好處就是在部署的時候，這些JS引用只用在初次部署，或者有改動的時候去動。由於自己的代碼脫離了這些引用，就可以放到任意地方了。

當然，也有很多別的方法幫你做到著一些，比如把JS引用放到MasterPage中，你甚至可以用SmartTools jQueryLoader for SharePoint去自動做這些事情。

 

 

做好這些準備工作以後，就可以開始真正的寫自己的代碼了。

首先，解釋下思路，如，對於一個SharePoint Field，會被解釋成為一個TR（紅色框）。其中分為2列（TD，藍色框），然後TD中會有控制項（綠色框）。

一般來說，左邊是控制項的Label，這個是比較固定的，而右邊，根據控制項的不同，控制項解析出來的HTML會有很多變化。

所以我選擇左邊的Label入手，隱藏整個SharePoint Field。

 

隱藏後效果：

 

代碼：

$(document).ready( function (){Init();RenderControls();});function Init(){CacheVariables(); //緩衝變數，這裡主要緩衝了列表的結構lblTitle = GetFormLabelBySchema(GetFieldSchema(FIELD_LIST_Schema, "Title"));}function RenderControls(){SetListFormFieldRowByLabel(lblTitle, "hide");$(ctrlListForm).show();}function CacheVariables(){if (FIELD_LIST_Schema == ""){GetList(FIELD_LIST, false, function (xData){FIELD_LIST_Schema = xData;}, function(){FIELD_LIST_Schema = "";});}}function GetList(listName, async, callback, errorHanlder){$().SPServices({operation: "GetList",listName: listName,async: async,completefunc: function(xData,Status) {           //alert(xData.responseText);if(Status=="success") {callback(xData.responseXML); } else { errorCode = -1; errorMessage = $(xData.responseXML).find("errorstring").first().text(); errorHanlder(xData.responseXML); }  }});}//這個方法根據結構找到對應每一列的標題function GetFormLabelBySchema(fieldXML){var title = fieldXML.attr("DisplayName"); var required = fieldXML.attr("Required");if (required == "TRUE") {title = title+' * ';} else {title = title+' ';}var ctrls = $('h3[innerText="'+title+'"]');if (ctrls.length == 0) {return null;} else {return ctrls.first();}}//根據標題設定整行屬性function SetListFormFieldRowByLabel(ctrl, status) {var ctrlRow = ctrl.closest("tr");switch (status) {case "hide":ctrlRow.hide(); break;case "show":ctrlRow.show();break;case "disabled":ctrlRow.attr("disabled","disabled");break;case "enabled":ctrlRow.removeAttr("disabled");break;}}//從列表的結構中分離出一列的結構資訊，可以用來尋找顯示名，列的類型等等function GetFieldSchema(fields, fname){return $(fields).find('Field[Name="'+fname+'"]').first();}

最後，使用JavaScript主要是為了動態實現列的顯示或者隱藏。在某些情況下，不需要動態，而是一種純靜態，例如，需要對目前記錄進行評分，而不希望使用者編輯這個資訊，可以用一下方法實現。

 

首先允許管理Content Type，

這樣你就可以看到Content Type了，並且在添加列的時候多了一個選項，不要選擇Add to all content types

奧秘就在這選項中，如果你添加的這一列不在任何一個Content Type中，那麼在New/Edit的時候就不會顯示出來的，如果想利用到這個值，就需要工作流程或者一些自訂了。