easy UI获取数据，打开毕弹窗
<div id="modalwindow" class="easyui-window" data-options="modal:true,closed:true,minimizable:false,shadow:false"></div>
<button id="pp"></button>
var rows = $('#List').datagrid('getSelections');
$("#modalwindow").html("<iframe width='100%' height='98%' scrolling='no' frameborder='0'' src='/AjaxUser/Create/"+rows[0].id+"'></iframe>");
$("#modalwindow").window({ title: '新增', width: 700, height: 400, iconCls: 'icon-add' }).window('open');
Html全部代码
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Index_Layout.cshtml";
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>GridView</title>
<script type="text/javascript">
$(function () {
$('#List').datagrid({
toolbar: [{
text: '添加',
iconCls: 'icon-add',
height:50,
handler: function () {
$('#List').datagrid('endEdit', lastIndex);
lastIndex = $('#List').datagrid('getRows').length - 1;
$('#List').datagrid('selectRow', lastIndex);
$('#List').datagrid('beginEdit', lastIndex);
}
}, '-', {
text: '删除',
iconCls: 'icon-remove',
height: 50,
handler: function () {
var row = $('#List').datagrid('getSelected');
if (row) {
var index = $('#List').datagrid('getRowIndex', row);
$('#List').datagrid('deleteRow', index);
}
}
}, '-', {
text: '保存',
iconCls: 'icon-save',
height: 50,
handler: function () {
var row = $('#List').datagrid('getSelected');
if (row != null) {
$("#modalwindow").html("<iframe width='100%' height='99%' frameborder='0' src='/SysSample/Edit?id=" + row.Id + "&Ieguid=" + GetGuid() + "'></iframe>");
$("#modalwindow").window({ title: '编辑', width: 700, height: 430, iconCls: 'icon-edit' }).window('open');
} else { $.messageBox5s('提示', '请选择要操作的记录'); }
}
}, '-', {
text: '刷新',
height: 50,
iconCls: 'icon-undo',
handler: function () {
$('#List').datagrid('rejectChanges');
}
}, '-', {
text: '搜索',
height: 50,
iconCls: 'icon-search',
handler: function () {
var rows = $('#List').datagrid('getSelections');
$("#modalwindow").html("<iframe width='100%' height='98%' scrolling='no' frameborder='0'' src='/AjaxUser/Create/"+rows[0].id+"'></iframe>");
$("#modalwindow").window({ title: '新增', width: 700, height: 400, iconCls: 'icon-add' }).window('open');
}
}],
title:"DataGrid的标题",
url: '/AjaxUser/loadjson2',
width: 500,
methord: 'post',
height:500,
fitColumns: true,
sortName: 'id',
sortOrder: 'desc',
idField: 'id',
pageSize: 20,
//pageList: 20,
pagination: true,
striped: true, //奇偶行是否区分
singleSelect: true,//单选模式
rownumbers: true,//行号
columns: [[
{ field: 'id', title: 'id', width: 80 },
{ field: 'realname', title: '名称', width: 120 },
{ field: 'sex', title: 'sex', width: 80, align: 'left' }
]]
});
});
</script>
</head>
<body>
<div>
<table id="List"></table>
<div id="modalwindow" class="easyui-window" data-options="modal:true,closed:true,minimizable:false,shadow:false"></div>
<button id="pp"></button>
</div>
</body>
</html>
easy UI获取数据，打开毕弹窗的更多相关文章
- JQuery Easy Ui dataGrid 数据表格 ---制作查询下拉菜单
JQuery Easy Ui dataGrid 数据表格 数据表格 - DataGrid 继承$.fn.panel.defaults,使用$.fn.datagrid.defaults重载默认值.. 数 ...
- jquery Easy UI Datagrid(数据网格)学习心德，附API
第一步,引入主要的css样式和js文件 <meta http-equiv="Content-Type" content="text/html; charset=ut ...
- JQuery Easy Ui dataGrid 数据表格
数据表格 - DataGrid 英文文档:http://www.jeasyui.com/documentation/index.php# 继承$.fn.panel.defaults,使用$.fn.da ...
- JQuery Easy Ui dataGrid 数据表格 -->转
转至: http://www.cnblogs.com/cnjava/archive/2013/01/21/2869876.html#events 数据表格 - DataGrid 内容 概况 使用方法 ...
- easy ui datagrid 数据分页
参照easyui官方网站提供的demo写了个datagrid数据分页的demo, 具体参数我就不一一罗列了,详细见官方网站, 这里只介绍一下具体的注意事项和常乃用到的几项, $('#test').da ...
- 玩转Web之easyui(一)-----easy ui datagird 分页
easy ui 中数据表格的分页其实是很简单的,分页是在数据表格可以正常显示数据的基础上进行的,在这里给出servlet的代码,其中selectAll()方法是从数据库中提取所有数据, 分页的一种思路 ...
- spring mvc +easy ui +Mybatis 录入数据
1.itemsEasyui.jsp 应用到的插件及知识点:日期控件My97 ,图片本地预览函数PreviewImage() (1)easy ui 的模态窗口使用时,要指定DIV的属性 data-opt ...
- easy ui 下拉框绑定数据select控件
easy ui 中的下拉框控件叫做select,具体代码如下: html代码:①.这是一个公司等级的下拉框 <tr> <td>公司等级:</td> <td&g ...
- 玩转Web之Json（二）----jquery easy ui + Ajax +Json+SQL实现前后台数据交互
最近在学Json,在网上也找过一些资料,觉得有点乱,在这里,我以easy ui的登录界面为例来说一下怎样用Json实现前后台的数据交互 使用Json,首先需要导入一些jar包,这些资源可以在网上下载到 ...
随机推荐
- Errors occurred during the build. Errors running builder 'JavaScript Validator' on project 'XXX'.
Errors occurred during the build. Errors running builder 'JavaScript Validator' on project 'XXX'. ...
- Java关键字:transient,strictfp和volatile简介
关键字:transient 使用对象:字段 介绍:transient说明一个属性是临时的,不会被序列化. 当对象进行序列化(Serializable)过程时候,有一些属性的状态是瞬时的,这样的对象是无 ...
- html、css、js文件加载顺序及执行情况
HTML页面加载和解析流程 1. 用户输入网址(假设是个html页面,并且是第一次访问),浏览器向服务器发出请求,服务器返回html文件. 2. 浏览器开始载入html代码,发现<head& ...
- 记录一个多核CPU负载不均衡问题（动态绑定进程到指定cpu：taskset -pc $CPU $PID）
昨晚和一位读者朋友讨论了一个问题:在一台多核 CPU 的 Web 服务器上,存在负载不均衡问题,其中 CPU0 的负载明显高于其它 CPUx,进一步调查表明 PHP-FPM 的嫌疑很大.话说以前我曾经 ...
- Apache配置多域名 AH00548: NameVirtualHost has no effect and will be removed in the next release
httpd-vhosts.conf 中首行 NameVirtualHost *:80 删除掉即可解决.
- 关于checkbox与文字混排无法对齐的解决方法
先前代码如下 <span style="vertical-align:middle"><input type="checkbox" name ...
- php public protected private属性实例详解
php 类中函数和类变量都有三个属性:public protected private,具体什么时候使用什么属性好纠结,特意找了个实例,这样看起来更清晰. public 表示全局,类内部外部子类都可以 ...
- Spring MVC 上传文件
Spring MVC上传文件需要如下步骤: 1.前台页面,form属性 method设置为post,enctype="multipart/form-data" input的typ ...
- ThinkPHP 模板判断输出--Switch 标签
ThinkPHP 模板引擎支持 switch 判断,根据不同情况输出不同的值,格式如下:<switch name="变量名" > <case value=& ...
- 20151010 C# 第一篇 变量类型
20151010 变量类型: 1. 值类型:变量本身直接存储数据 整数类型:代表没有小数点的整数数值 类型 说明 范围 sbyte 8位有符号整数 -128——127 short 16位有符号整数 - ...