关于easyUI Dialog的创建以及Dialog如何获取选中DataGrid中的值
来源:互联网 发布:2333软件登录不了 编辑:程序博客网 时间:2024/06/02 05:35
首先,我们需要导相应的easyUI包和CSS,这里就不必多说了
1,创建easyUI Dialog
,我们需要一个点击事件
<a onclick="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 onclick="toAdd();" type="button" id="dept_button" value="提交 "/>
</center>
</form>
</div>
就是那么简单,就这样就完成弹出easyUI Dialog的表单了
2,Dialog如何获取选中DataGrid中的值
首先,还是需要一个触发事件
<a onclick="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 onclick="toAdd();" type="button" id="dept_button" value="提交 "/>
</center>
</form>
</div>
就是那么简单,就这样就完成弹出easyUI Dialog获取选中DataGrid中的值的表单了。
- 关于easyUI Dialog的创建以及Dialog如何获取选中DataGrid中的值
- easyui+如何弹出dialog中包含datagrid
- EasyUI获取datagrid选中值
- easyUI 创建Dialog对话框
- Jquery Easyui datagrid如何在动态获取当前选中行的值
- EasyUi DataGrid 获取选中行的checkbox
- Easyui 创建dialog的两种方式,以及他们带来的问题
- 重写 easyui 的 dialog
- jquery-easyui中创建Dialog
- easyui动态创建一个dialog
- EasyUI 动态创建对话框Dialog
- Android中的Dialog的使用以及自定义Dialog
- EasyUI中的dialog修改样式
- easyUI Dialog
- easyui--dialog
- easyui-dialog
- EasyUi datagrid选中行的index值
- 关于获取dialog中edittext的值问题
- Android平板适配宽高笨方法
- 使用CSS实现一列布局
- 2017年山东省第八届ACM大学生程序设计竞赛 B Quadrat(sdut 3894) 打表找规律
- iOS每日一记之———————————————集成阿里云的移动数据统计SDK (埋点统计)
- 【贪心】【枚举】【重庆市NOIP模拟赛】旅行
- 关于easyUI Dialog的创建以及Dialog如何获取选中DataGrid中的值
- (第二大类)结构型模式 小小总结一下
- Entity FrameWork初始化数据库的四种策略
- python的unittest模块实现软件单元测试
- MyBatis如何防止SQL注入
- Java-JDBC连接池
- java基础之接口
- buddy system
- CCNA第七天(IPsec配置)