SharePoint:扩展DVWP - 第21部分:实现可维护的三级联动下拉框
上一次,我们通过几个简单的步骤实现了级联下拉框——一个下拉框可以过滤另一个的可选项。
但是,如果我们有三个下拉框需要做级联该怎么做呢?比如,国家-省-市。或者工作地点-组-职位。
接下来的步骤相对于前面介绍的步骤来说有点重复:
2、创建一个网站栏,类型为查阅项,信息来源指向该列表
3、创建一个关系列表,用于存放新的第三级项和第二级项的对应关系。
4、填充关系列表数据
5、在我们工作的列表中添加新创建的网站栏
实例——地质数据
下面是一个在DVWP中实现的三级级联的例子:
第三级和第二级级联的jQuery脚本和第一级和第二级级联的脚本很类似:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <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
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!