热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

datagrid+toolbar不分页显示

1新建DataGrid.js文件******el:tableid****functionshowDataGrid(el){$(el).datagrid({title:不分页的gr

1 新建DataGrid.js文件

/**** **el: table id* ***/
function showDataGrid(el) {$(el).datagrid({title: &#39;不分页的gridview&#39;,url: &#39;/Home/GetUserInfo&#39;, //一个用以从远程站点请求数据的超链接地址。method: &#39;get&#39;, //请求远程数据的方法类型 默认 postloadMsg: &#39;数据正在加载&#xff0c;请稍等...&#39;,//当从远程站点载入数据时&#xff0c;显示的一条快捷信息。autoRowHeight: true, //定义设置行的高度&#xff0c;根据该行的内容。设置为false可以提高负载性能。height: 1000, // 设置高度width: &#39;auto&#39;, //设置宽度striped: true,//设置为true将交替显示行背景。nowrap: true,//设置为true&#xff0c;当数据长度超出列宽时将会自动截取。rownumbers: true,//设置为true将显示行数。singleSelect: true,//设置为true将只允许选择一行。sortName: &#39;Age&#39;, //当数据表格初始化时以哪一列来排序。sortOrder: &#39;asc&#39;,//定义排序顺序&#xff0c;可以是&#39;asc&#39;或者&#39;desc&#39;&#xff08;正序或者倒序&#xff09;。showFooter: false,//定义是否显示行底&#xff08;如果是做统计表格&#xff0c;这里可以显示总计等&#xff09; cache: true,iconCls: &#39;icon-save&#39;, // 设置表头的图标collapsible: true, //右上角可以折叠toolbar: toolbar,columns: [[{field: &#39;&#39;,title: &#39;&#39;,checkbox: true}, {field: &#39;Name&#39;,title: &#39;姓名&#39;,width: 100,sortable: true, //设置为true允许对该列排序。rowspan: 1, //表明一个单元格跨几行。colspan: 1, // 表明一个单元格跨几列。hidden: false,//设置为true将隐藏列。//格式化单元格函数&#xff0c;有3个参数&#xff1a;//value&#xff1a;字段的值。// rowData&#xff1a;行数据。// rowIndex&#xff1a;行索引。formatter: function (value, row, index) {if (index &#61;&#61; 1) {return &#39;sasasas&#39;;}elsereturn value;},//单元格样式函数&#xff0c;返回样式字符串装饰表格如&#39;background:red&#39;&#xff0c;function有3个参数&#xff1a;//value&#xff1a;字段值。// rowData&#xff1a;行数据。// rowIndex&#xff1a;行索引。styler: function (value, row, index) {if (index <9)return &#39;background-color:yellow;color:red;&#39;;},editor: &#39;text&#39;},{ field: &#39;Age&#39;, title: &#39;年龄&#39;, width: 100 },{ field: &#39;Work&#39;, title: &#39;工作&#39;, width: 100 },]],fitColumns: true,rowStyler: function (index, row) { //返回样式&#xff0c;如&#xff1a;&#39;background:red&#39;&#xff0c;function有2个参数&#xff1a;if (index &#61;&#61; 10) // index&#xff1a;行索引&#xff0c;从0开始.return &#39;background-color:red;color:#fff;&#39; // row&#xff1a;对应于该行记录的对象。 },// 以下三个属性 分组//groupField: &#39;Name&#39;, //view:groupview, // 这个 function 要自己写//groupFormatter: function (value, rows) { // 值// return &#39;分组&#39; - value &#43; &#39; - &#39; &#43; rows.length &#43; &#39; Item(s)&#39;; //rows 总的个数 //}});
}
// 定义toolbar
var toolbar &#61; [{text: &#39;Add&#39;,iconCls: &#39;icon-add&#39;,handler: function () { alert(&#39;add&#39;) }
}, {text: &#39;Cut&#39;,iconCls: &#39;icon-cut&#39;,handler: function () { $.messager.alert(&#39;info&#39;,&#39;cut&#39;) }
}, &#39;-&#39;, {text: &#39;Save&#39;,iconCls: &#39;icon-save&#39;,handler: function () { alert(&#39;save&#39;) }
}];

  2  前端使用&#xff1a;

<script src&#61;"~/jquery-easyui-1.5.5.2/jquery.min.js">script>
<script src&#61;"~/jquery-easyui-1.5.5.2/jquery.easyui.min.js">script>
<script src&#61;"~/jquery-easyui-1.5.5.2/locale/easyui-lang-zh_CN.js">script>
<link href&#61;"~/jquery-easyui-1.5.5.2/themes/default/easyui.css" rel&#61;"stylesheet" />
<link href&#61;"~/jquery-easyui-1.5.5.2/themes/icon.css" rel&#61;"stylesheet" /><div style&#61;"margin:20px;width:1100px"><table id&#61;"dgv">table>div><script src&#61;"~/Scripts/EasyUI/DataGrid.js">script><script>$(document).ready((function () {// 这个地方必须要放在这个里面&#xff0c;否则会导致有边框不显示
showDataGrid("#dgv");}));script>

展示&#xff1a;

 

转:https://www.cnblogs.com/hnzheng/p/9184044.html



推荐阅读
  • 本文讨论了一个关于cuowu类的问题,作者在使用cuowu类时遇到了错误提示和使用AdjustmentListener的问题。文章提供了16个解决方案,并给出了两个可能导致错误的原因。 ... [详细]
  • Webpack5内置处理图片资源的配置方法
    本文介绍了在Webpack5中处理图片资源的配置方法。在Webpack4中,我们需要使用file-loader和url-loader来处理图片资源,但是在Webpack5中,这两个Loader的功能已经被内置到Webpack中,我们只需要简单配置即可实现图片资源的处理。本文还介绍了一些常用的配置方法,如匹配不同类型的图片文件、设置输出路径等。通过本文的学习,读者可以快速掌握Webpack5处理图片资源的方法。 ... [详细]
  • 本文介绍了如何使用php限制数据库插入的条数并显示每次插入数据库之间的数据数目,以及避免重复提交的方法。同时还介绍了如何限制某一个数据库用户的并发连接数,以及设置数据库的连接数和连接超时时间的方法。最后提供了一些关于浏览器在线用户数和数据库连接数量比例的参考值。 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • 1,关于死锁的理解死锁,我们可以简单的理解为是两个线程同时使用同一资源,两个线程又得不到相应的资源而造成永无相互等待的情况。 2,模拟死锁背景介绍:我们创建一个朋友 ... [详细]
  • 后台获取视图对应的字符串
    1.帮助类后台获取视图对应的字符串publicclassViewHelper{将View输出为字符串(注:不会执行对应的ac ... [详细]
  • 《数据结构》学习笔记3——串匹配算法性能评估
    本文主要讨论串匹配算法的性能评估,包括模式匹配、字符种类数量、算法复杂度等内容。通过借助C++中的头文件和库,可以实现对串的匹配操作。其中蛮力算法的复杂度为O(m*n),通过随机取出长度为m的子串作为模式P,在文本T中进行匹配,统计平均复杂度。对于成功和失败的匹配分别进行测试,分析其平均复杂度。详情请参考相关学习资源。 ... [详细]
  • 高质量SQL书写的30条建议
    本文提供了30条关于优化SQL的建议,包括避免使用select *,使用具体字段,以及使用limit 1等。这些建议是基于实际开发经验总结出来的,旨在帮助读者优化SQL查询。 ... [详细]
  • 深入理解CSS中的margin属性及其应用场景
    本文主要介绍了CSS中的margin属性及其应用场景,包括垂直外边距合并、padding的使用时机、行内替换元素与费替换元素的区别、margin的基线、盒子的物理大小、显示大小、逻辑大小等知识点。通过深入理解这些概念,读者可以更好地掌握margin的用法和原理。同时,文中提供了一些相关的文档和规范供读者参考。 ... [详细]
  • PHP引用的概念和用法详解
    本文详细介绍了PHP中引用的概念和用法。引用是指不同的变量名访问同一个变量内容,类似于Unix文件系统中的hardlink。文章从引用的定义、作用、语法和注意事项等方面进行了解释和示例。同时还介绍了对未定义变量使用引用的情况,以及在函数和new运算符中使用引用的注意事项。 ... [详细]
  • VScode格式化文档换行或不换行的设置方法
    本文介绍了在VScode中设置格式化文档换行或不换行的方法,包括使用插件和修改settings.json文件的内容。详细步骤为:找到settings.json文件,将其中的代码替换为指定的代码。 ... [详细]
  • 本文介绍了数据库的存储结构及其重要性,强调了关系数据库范例中将逻辑存储与物理存储分开的必要性。通过逻辑结构和物理结构的分离,可以实现对物理存储的重新组织和数据库的迁移,而应用程序不会察觉到任何更改。文章还展示了Oracle数据库的逻辑结构和物理结构,并介绍了表空间的概念和作用。 ... [详细]
  • 展开全部下面的代码是创建一个立方体Thisexamplescreatesanddisplaysasimplebox.#Thefirstlineloadstheinit_disp ... [详细]
  • 本文介绍了如何使用n3-charts绘制以日期为x轴的数据,并提供了相应的代码示例。通过设置x轴的类型为日期,可以实现对日期数据的正确显示和处理。同时,还介绍了如何设置y轴的类型和其他相关参数。通过本文的学习,读者可以掌握使用n3-charts绘制日期数据的方法。 ... [详细]
  • 程序员如何选择机械键盘轴体?红轴和茶轴对比
    本文介绍了程序员如何选择机械键盘轴体,特别是红轴和茶轴的对比。同时还介绍了U盘安装Linux镜像的步骤,以及在Linux系统中安装软件的命令行操作。此外,还介绍了nodejs和npm的安装方法,以及在VSCode中安装和配置常用插件的方法。最后,还介绍了如何在GitHub上配置SSH密钥和git的基本配置。 ... [详细]
author-avatar
zjjj-jz政
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有