首先,我们需要导相应的easyUI包和CSS,这里就不必多说了
1,创建easyUI Dialog
,我们需要一个点击事件
<a οnclick="add_dept();" class="easyui-linkbutton" iconCls="icon-add" plain="true" title="添加部门"></a>
点击之后触发add_dept()函数
具体函数如下
js代码:
function add_dept () {
$("#dialog").show();//必须先显示,再弹出
$("#dialog").dialog({
title: "添加",
modal:true,//遮幕
width: 400,
height: 200
});
}
然后在html页面有:
<div id="dialog" style="display: none;">
<div class="opy">
<div class="headnote login_ts" style="display: block;" id="error_tips"></div>
</div>
<form id="dept_form" action="">
<center>
昵称:
<input type="text" id="nick_name" /><br />
性别:
<input type="text" id="user_sex" /><br />
部门:
<input type="text" id="dept_name" /><br />
电话:
<input type="text" id="user_phone" /><br />
邮箱:
<input type="text" id="user_email" /><br />
<input οnclick="toAdd();" type="button" id="dept_button" value="提交 "/>
</center>
</form>
</div>
就是那么简单,就这样就完成弹出easyUI Dialog的表单了
2,Dialog如何获取选中DataGrid中的值
首先,还是需要一个触发事件
<a οnclick="edit_dept();" class="easyui-linkbutton" iconCls="icon-edit" plain="true" title="编辑部门"></a>
然后js代码如下:
function edit_dept(){
var row = $('#dg').datagrid('getSelected');//获取当前行
if (row!=null){
$("#dialog").show();//必须先显示,再弹出
$("#dialog").dialog({
title: "修改",
modal:true,
width: 400,
height: 200
});
//读取方式,根据row的字段row.xxx
$("#nick_name").val(row.nick_name);
$("#user_sex").val(row.user_sex);
$("#dept_name").val(row.dept_name);
$("#user_phone").val(row.user_phone);
$("#user_email").val(row.user_email);
}else{ alert("请选中数据");}
}
然后在html页面有:
<div id="dialog" style="display: none;">
<div class="opy">
<div class="headnote login_ts" style="display: block;" id="error_tips"></div>
</div>
<form id="dept_form" action="">
<center>
昵称:
<input type="text" id="nick_name" /><br />
性别:
<input type="text" id="user_sex" /><br />
部门:
<input type="text" id="dept_name" /><br />
电话:
<input type="text" id="user_phone" /><br />
邮箱:
<input type="text" id="user_email" /><br />
<input οnclick="toAdd();" type="button" id="dept_button" value="提交 "/>
</center>
</form>
</div>
就是那么简单,就这样就完成弹出easyUI Dialog获取选中DataGrid中的值的表单了。