<link rel="stylesheet" type="text/css" href="../../script/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../../script/themes/icon.css" />
<script type="text/javascript" src="../../script/jquery-1.4.2.min.js" </script>
<script type="text/javascript" src="../../script/jquery.easyui.min.js" </script>
<script type="text/javascript" src="../../script/locale/easyui-lang-zh_CN.js" mce_src="script/locale/easyui-lang-zh_CN.js"></script>
js:
<script type="text/javascript"><!--
$(function(){
$('#tt').datagrid({
width:810,
height:400,
idField:'xsbh',
url:'studentHandler.ashx',
singleSelect:true,
columns:[[
{field:'xsbh',title:'编号',width:80},
{field:'UserName',title:'姓名',width:100},
{field:'Sex',title:'性别',width:30},
{field:'SchoolYear',title:'年份',width:50},
{field:'opt',title:'操作',width:100,align:'center',
formatter:function(value,rec,index){
var s = '<a href="#" mce_href="#" onclick="view(\''+ rec.xsbh + '\')">查看</a> ';
var e = '<a href="#" mce_href="#" onclick="edit(\''+ rec.xsbh + '\')">编辑</a> ';
var d = '<a href="#" mce_href="#" onclick="del(\''+ index +'\')">删除</a> ';
return s+e+d;
}
}
]],
toolbar:[{
text:'增加',iconCls:'icon-add',handler:function(){
window.location.href='StuAdd.aspx';
}
},
{text:'导入',iconCls:'icon-add',handler:function(){
window.location.href='StuImport.aspx'
}
},
{text:'查找',iconCls:'icon-search'}
],
pagination:true
});
})
function view(bh) //转到查看页面
{
window.location.href='StuView.aspx?id='+bh+'&page=stu';
// var row = $('#tt').datagrid('getSelected');
// if(row)
// {
// alert(row.xsbh);
// }
}
function edit(bh) //转到编辑页面
{
window.location.href='StuEdit.aspx?id='+bh;
}
function del(index){ //删除操作
$.messager.confirm('确认','确认删除?',function(row){
if(row){
var selectedRow = $('#tt').datagrid('getSelected'); //获取选中行
$.ajax({
url:'delHandler.ashx?id='+selectedRow.xsbh+'&type=stu',
//加了个type,作用是以后不管什么删除,都可以转到这个ashx中处理
success:function(){alert('删除成功');}
});
$('#tt').datagrid('deleteRow',index);
}
})
}
// --></script>
分享到:
相关推荐
这个“jquery easyui datagrid demo”包含了一些关于如何使用 jQuery EasyUI 中 Datagrid 组件的示例和相关文档,帮助我们理解和应用 Datagrid。 首先,`datagrid.doc` 文件很可能是 Datagrid 的简要说明文档,它...
jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) Demo 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停离开事件,源码奉献!!!
在jQuery EasyUI中,DataGrid是一种常用的表格展示控件,它可以与各种编辑器结合使用,如combobox(下拉框)来实现更丰富的交互功能。本文主要探讨的是如何利用jQuery EasyUI的DataGrid和combobox组件实现多级联动的...
jquery easyui datagrid 性能优化,优化后可快速提升查询性能。唯一的缺陷就是不支持可编辑grid了。只需要在引入easyui.js后面引入此js即可。
由于EasyUI Datagrid的默认行为不包括鼠标悬停弹窗,我们需要通过修改源码或者扩展实现来添加这个功能。在描述中提到的方法是直接修改了源码,这可能涉及到对EasyUI内部机制的理解,以及对源码的调试和测试。 4. *...
在IT行业中,EasyUI Datagrid是一款基于jQuery的前端数据展示组件,它提供了丰富的表格功能,如排序、分页、过滤等。在实际工作中,我们经常需要将这些展示的数据导出到Excel文件,以便进行进一步的分析或存储。下面...
综上所述,这个 JqueryEasyUI DataGrid 示例展示了如何使用前端框架与后端服务器配合,实现一个功能完备的表格应用。在实际开发中,开发者可以根据需求调整 DataGrid 的配置项,以及后台 Servlet 的逻辑,以适应各种...
主要介绍了jquery easyui datagrid实现增加,修改,删除方法,结合实例形式分析了jquery easyui datagrid结合asp.net实现数据的增删改等操作的步骤与相关技巧,需要的朋友可以参考下
easyui datagrid editor回车切换单元格示例,适合熟悉easyui但又不懂如何做的人员,可能参考一下源码JS。
jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列丰富的组件,使得开发者可以轻松构建用户界面,而 Datagrid 是其中非常重要的一个组件,常用于数据展示和管理。本篇文章将详细解析 jQuery EasyUI ...
jQuery EasyUI Datagrid 是一个基于 jQuery 和 EasyUI 框架的数据网格组件,它提供了丰富的数据展示和操作功能,常用于构建数据密集型的Web应用。这个教程将深入讲解其核心概念、用法以及常见应用。 一、jQuery ...
JQuery EasyUI DataGrid服务端分页加载数据后,DataGrid行号不能延续,总是重新由1开始。因为服务端分页取回的是单页数据,通过LoadData方法加载数据后,pageNumber属性被初始化为1,因此行号总是重新由1开始。现在...
在IT领域,EasyUI Datagrid是一款基于jQuery的前端数据展示组件,它提供了丰富的表格功能,如数据分页、排序、筛选等。当我们需要将Datagrid中的数据进行打印时,可能会遇到一些挑战,因为通常默认的浏览器打印功能...
在datagrid的onLoadSuccess事件增加代码处理。 <style type=text/css> .subtotal { font-weight: bold; }/*合计单元格样式*/ </style> [removed] function onLoadSuccess() { //添加“合计”列 $...
jquery easyui 扩展 datagrid 自定义动态隐藏显示列
EasyUI是一个基于jQuery的UI库,提供了丰富的组件,包括datagrid,它是一个用于展示表格数据的组件。在某些场景下,用户可能希望在滚动表格时,某些重要的列(通常是标题或标识列)始终保持可见,这就是“右冻结”的...
### 解决EasyUI dataGrid列较多时无数据显示不全的问题 在使用EasyUI框架进行前端开发的过程中,可能会遇到dataGrid组件在数据为空时列显示不完整的问题。这不仅影响用户体验,也降低了系统的可用性。本文将详细...
JS EasyUI DataGrid是一款基于jQuery和EasyUI框架的数据表格组件,它提供了丰富的功能,如数据分页、排序、过滤和自定义操作等。在实际应用中,动态加载数据是DataGrid的一个重要特性,允许用户在需要时加载更多的...
在IT行业中,EasyUI是一个基于JavaScript和jQuery的前端框架,它提供了一系列的UI组件,用于构建用户界面。在描述中提到的"easyui的datagrid生成合并行,合计计算价格",指的是如何使用EasyUI的DataGrid组件来实现...
EasyUI 是一个基于 jQuery 的 UI 框架,它提供了丰富的组件,包括表格(DataGrid)等,使得 Web 应用程序的界面开发更加便捷。在这个"EasyUI DataGrid 过滤用法实例"中,我们将深入探讨如何利用 EasyUI 的 DataGrid ...