3

這段程式碼背後有段心酸有趣的故事...

今天同事轉達User的需求給我，程式都寫完了，才驚覺一個多月前我早就寫過同樣的程式邏輯，而且還是同一位同事提的需求。換句話說，提需求的人跟做需求的人居然他X的很有默契地一起把需求忘個精光，讓我不禁思索起: 每日忙著處理的這些需求，對我的人生，究竟存在什麼意義? (謎之聲: 意義是... 黑暗: 你給我滾!!)

回到正題(跳一下)，回頭檢討，如果上次我有發文記錄一下心得，應該就不會發生此等慘事... 這，就是本文的由來。

需求是這樣的: 在Sharepoint的頁面上有一個清單WebPart(如下圖)，分別列出類別、部落客名稱及連結，內建的設計，點名稱時會開啟項目檢視，我們希望能將它調整成"點名稱直接在新視窗開啟連結"。雖然透過神通廣大的ListView WebPart修改也能客製出任何我們想要的樣子，但每回編修XSL常讓我爆血管，所以我還是習慣在前端加入客製JS，請jQuery跟我一起衝鋒陷陣。

做法是在頁面上多放入一個"內容編輯器組件"，其中放入以下Javascript程式碼:

<!--若MasterPage未載入jQuery，記得要補上-->
<script type="text/javascript" src="/somepath/jQuery-1.4.2.js">
</script>
<script type="text/javascript">
$(function() {
 
    var titleToFind = "部落客名人榜";
    //由WebPart標題找出WebPartID
    var webPartId = 
        $("tr.ms-WPHeader td[title=" + titleToFind + "]").attr("id")
        .replace("Title", "");
    //在WebPart DIV中取得Table
    var $tbl = 
        $("div#" + webPartId + " table.ms-listviewtable");
    //標題列tr.ms-viewheadertr
    $tbl.find("> tbody > tr").each(function() {
        var $tr = $(this);
        var $td = $tr.children(":last");
        var link = $td.children("a").attr("href");
        $td.remove();
        $tr.find(">td:last a").attr({
            //因原有onclick攔截以MOSS自己的JS開連結
            //將onclick移除及設為開在新視窗
            "href":link, "onclick":"", "target":"_blank" 
        });
    });
 
});
</script>

透過jQuery高超的元素操控能力，只需要短短幾行程式，很快就能透過標題找出組件，挖出組件中的Table，將最後一欄的連結href搬到前一欄的<a>上。由於Sharepoint寫了自己的onclick事件用客製方法開啟連結，無法控制連結開在新視窗，因此我們還得卸除onclick事件，加上target="_blank"，才算大功告成。

我發誓，下回一定不會忘記我寫過用jQuery調整Sharepoint頁面的程式。


Comments

# by joeshow

再次学习。。

# by John

如果List中的資料使用Group by及By default 是Collapsed . 就不能加上target="_blank"，

# by John

如果使用了Groupby 和 Collapsed, 就不能加上target="_blank"

Post a comment