SharePoint Technical Notes

以前の記事で、タイトル列の非表示を例にあげ、SharePoint Designer 2007 のユーザー設定のリストフォームを利用する方法をご紹介しました。http://shanqiai.weblogs.jp/sharepoint_technical_note/2007/12/newformaspx_edi_d88b.html

便利な機能ではあるのですが、使い方によっては不具合も多く見られるようです。たとえば、2929さんが何度かコメントされていますがテンプレート化して利用する際にエラーが表示されるなどです。

そこで、タイトル列を非表示にする別のアプローチを探っていたのですが、JavaScript を使って HTML DOM を操作するアプローチが現実的である場合があるように思います。もちろん、ブラウザ依存の部分を考えなければならず、本来はそうした差異を吸収してくれるのがASP.NETのコントロールであったりするわけですが、ある意味逆転の発想です。

参考までに、以下に任意のリストで「タイトル列を非表示にする」スクリプトコードの例を記述しておきます。

*****************************************

<asp:Content ContentPlaceHolderId="PlaceHolderMain" runat="server">

function hideTitle()
{

var targetTag=getTagFromIdenfifierAndTitle('input','TextField','タイトル');

while(targetTag.parentNode!=null)
{
tag=tag.parentNode;
if(tag.tagName=='TR')
{
tag.style.display='none';
return;
}
}

}//function

function getTagFromIdentifierAndTitle(tagName, identifier, title) {
var len = identifier.length;
var tags = document.getElementsByTagName(tagName);

for (var i=0; i < tags.length; i++) {
var tempString = tags[i].id;
if (tags[i].title == title && (identifier == "" || tempString.indexOf(identifier) == tempString.length - len)) {
return tags[i];
}//if
}//for

return null;
}//function

//-->
</script>

****************************************

上記のコードでは、"タイトル" と書かれているノードの親となる "TR" 要素を取得し、スタイル属性に "display:none" を指定しています。これで、テーブル内のタイトル行が非表示になるわけです。

このように JavaScript から DOM を操作するアプローチはロジックを考えるのが少々面倒なところはありますが、既存のWebパーツの邪魔をせずに必要なタグを修正したり、追加できるのでそれなりに使える場面は多いように思います。

開発者の方でも意外と JavaScript でコーディングする機会は少ないかも知れませんが、MOSS のエンジニアはJavaScript による DOM 操作の基本は押さえておきたいですね。

参考:　SharePoint Designer 2007 Team Blog (英語)