SharePoint：擴充DVWP – 第21部分：實現可維護的三級聯動下拉框

文章目錄

• 執行個體——地質資料

上一次，我們通過幾個簡單的步驟實現了級聯下拉框——一個下拉框可以過濾另一個的可選項。

但是，如果我們有三個下拉框需要做級聯該怎麼做呢？比如，國家-省-市。或者工作地點-組-職位。

接下來的步驟相對於前面介紹的步驟來說有點重複：

1、建立一個查閱項列表並填充資料

2、建立一個網站欄，類型為查閱項，資訊來源指向該列表

3、建立一個關係列表，用於存放新的第三級項和第二級項的對應關係。

4、填充關係列表資料

5、在我們工作的列表中添加新建立的網站欄

6、通過jQuery完成第二級和第三級項的級聯

執行個體——地質資料

下面是一個在DVWP中實現的三級級聯的例子：

第三級和第二級級聯的jQuery指令碼和第一級和第二級級聯的指令碼很類似：

 

<script src="/_layouts/Scripts/jquery-1.3.2.min.js" type="text/javascript"></script><script src="/_layouts/Scripts/jquery.SPServices-0.5.6.js" type="text/javascript"></script><script language="javascript" type="text/javascript">        $(document).ready(function() {                $().SPServices.SPCascadeDropdowns({                        relationshipWebURL: "/",                        relationshipList: "代紀關係",                         relationshipListParentColumn: "Dai",                            relationshipListChildColumn: "Ji",                         relationshipListSortColumn: "Ji",                         parentColumn: "代",                        childColumn: "紀",                        promptText: "(無)"                                                                            });                $().SPServices.SPCascadeDropdowns({                        relationshipWebURL: "/",                          relationshipList: "紀統關係",                         relationshipListParentColumn: "Ji",                         relationshipListChildColumn: "Tong",                         relationshipListSortColumn: "Tong",                          parentColumn: "紀",                        childColumn: "統",                        promptText: "(無)"                                                                            }); })</script>

這裡需要注意的還是在建立網站欄和關係列表時，中文名稱的命名一定要先起一個不含空格的字母組成的名字，然後再修改成中文的顯示名稱。以保證內部名稱的單純性。

代碼的運行效果和設想的一樣！

而且，更加人性化的地方是，對於一個子項對應多個父項的情況，如果父變了，而之前選中的子項對當前的父仍然有效話，該子項值還會保持選中狀態。不管是在二三級之間，還是在一二級之間都是如此。當然，對於上面的地層來說，不可能出現交插的情況。但如果是“工作地點-分組-職位”的話就完全有可能出現這種情況了。不同的工作地點下可能存在同一個組，或者不同的組中可能存在同一個職位。此時，父發生變化，只要子還是對於新的父項有效，則其值仍然會保持選中狀態。而不是像一般情況那樣被清空。

 

下一次：現在我們已經在查閱項欄位中填充了初始資料，並且建立了關係列表，如果關係列表能夠實現清單項目標題的“自命名”就好了。接下來的擴充DVWP系列中我們將通過一小段jQuery來實現該功能。

 

參考資料

SharePoint:Extending the DVWP - Part 21:Cascading Dropdowns - Three-tier Cascade