ecology开发之单选弹出框组件-赫非域

组件

多选弹出框组件

备注

功能说明

基于jQuery开发的多选组件，其特点如下：
1、使用ajax获取待选数据；
2、使用json格式自动返回所需数据；
3、支持分页显示数据及数据查询；
4、常用于单浏览按钮
（如单人员、单文档等）的展示选择

使用说明

1.引入如下js
如果没有引入以下js，那么需要引入以下js：
<!–以下是显示定制组件所需的js –>
<script language=javascript src=”/workplan/calendar/src/Plugins/jquery.form_wev8.js”></script>
<script type=”text/javascript” src=”/js/dragBox/ajaxmanager_wev8.js”></script>
<script type=”text/javascript” src=”/js/dragBox/rightspluingForSingleBrowser_wev8.js”></script>
<link type=”text/css” href=”/js/dragBox/e8browser_wev8.css” rel=stylesheet>

2、删除原来用于显示数据的内容，主要是<table class=BrowserStyle>中的内容，然后添加如下代码：

3、定义如下js方法，可以另外定义在js文件中
function showMultiDocDialog(selectids){
var config = null;
config= rightsplugingForBrowser.createConfig();
config.srchead=[“标题”,”主目录”,”文档所有者”];
config.container =$(“#colShow”);
config.searchLabel=””;
config.hiddenfield=”id”;
config.saveLazy = true;
config.srcurl = “/docs/docs/MutiDocBrowserAjax.jsp?src=src”;
config.desturl = “/docs/docs/MutiDocBrowserAjax.jsp?src=dest”;
config.pagesize = 10;
config.formId = “weaver”;
config.target = “queryIframe”;
config.parentWin = window.parent.parent;
config.selectids = selectids;
config.searchAreaId = “e8QuerySearchArea”;
jQuery(“#colShow”).html(“”);
rightsplugingForBrowser.createRightsPluing(config);
jQuery(“#btnok”).bind(“click”,function(){
rightsplugingForBrowser.system_btnok_onclick(config);
});
jQuery(“#btnclear”).bind(“click”,function(){
rightsplugingForBrowser.system_btnclear_onclick(config);
});
jQuery(“#btncancel”).bind(“click”,function(){
rightsplugingForBrowser.system_btncancel_onclick(config);
});
jQuery(“#btnsearch”).bind(“click”,function(){
rightsplugingForBrowser.system_btnsearch_onclick(config);
});
}

function btnOnSearch(){
jQuery(“#btnsearch”).trigger(“click”);
}

绿色部分是可变的，srcurl是获取源数据项的地址，desturl是获取已选数据的地址，formId是查询条件的form,
target为form所在的iframe的ID，默认为window

4、调用如下方法：
jQuery(document).ready(function(){
showMultiDocDialog(“<%=documentids%>”);
});

5、定义数据源页面，如/docs/docs/MutiDocBrowserAjax.jsp，该页面以json的格式返回数据，结构如下：
{
currentPage:1,
totalPage:1,
mapList:[
{id:1,name:2:desc:3},
{id:4,name:5,desc:”555″}
]
}

6、效果图如下：

例子

例子：http://192.168.4.44:8080/systeminfo/BrowserMain.jsp?mouldID=doc&url=/docs/docs/DocBrowser.jsp

转载请注明：赫非域 » ecology开发之单选弹出框组件

与本文相关的文章