| 标题 | jquery ezUI 双击行记录弹窗查看明细的实现方法 |
| 内容 | 下面小编就为大家带来一篇jquery ezUI 双击行记录弹窗查看明细的实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。 第一步：给DataGrid绑定onDblClickRow事件； <table id="dataTable" data-options=" url: '/ajaxget.aspx?_t='+new Date().getTime()+'&_action=SVNGetHandler.GetSearchPageData&searchType=&keyword=*', method: 'get', rownumbers: true, singleSelect:true, border:0, idField: 'Id', columns:[[ {field:'ProjectId',title:'项目Id',width:30,align:'left'}, {field:'ProjectName',title:'项目名称',width:150,align:'left'}, {field:'ProjectNum',title:'项目编号',width:100,align:'left'} ]], toolbar:'#myToolbar', pagination:true, fitColumns: true, pageSize:20, onDblClickRow:onDblClickRow "> </table> 第二步：编写行双击事件 //行双击事件 function onDblClickRow() { var item = $('#dataTable').datagrid("getSelected"); if (item != null) { editId = item.Id; var html = ""; html += "项目名称：" + item.ProjectName + "<br/>"; html += "项目编号：" + item.ProjectNum + "<br/>"; html += "<br/>"; show(item.ProjectName + " 项目详情", html); } } 第三步：弹出窗口显示详细信息： <div id="details"></div> function show(title, msg) { $('#details').html("<div id=\"output\" style=\"width:99%;height:96%;border:0\">" + msg + "</div>"); $('#details').dialog({ title: title, width: 800, height: 400, iconCls: 'icon-custom-eye', closed: false, cache: false, modal: true }); } 以上这篇jquery ezUI 双击行记录弹窗查看明细的实现方法就是小编分享给大家的全部内容了，希望能给大家一个参考 |
| 随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。