`
ldondon
  • 浏览: 18527 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

jqgrid colModel排序

    博客分类:
  • js
 
阅读更多

 说明:jqgrid属性colModel的字段排序,在于三个参数sortable:true,sortname:'name',sortorder:'asc'

下面附上列子:

function initList(){
  var height = getTabContentHeight()-133;
  var width = window.parent.document.documentElement.clientWidth-(window.screenLeft-window.parent.screenLeft)-186;
  $("#list").jqGrid({
      url:'<%=basePath%>customer!list.action',
   colModel: [
    {label:'企业名称', name:'name', align:"center",width:220}, 
    {label:'企业编号', name:'code',align:"center",width:60},
       {label:'企业性质', name:'type.title',index:'type', align:"center",width:60,hidden:true},
       {label:'入驻状态', name:'parkStatus.title',index:'parkStatus',align:"center",width:60},
       {label:'招商项目ID', name:'investmentId', align:"center",hidden:true},
       {label:'账号', name:'userId', align:"center", hidden:true},
       {label:'跟踪引进', name:'hostName', align:"center", hidden:true},
       {label:'技术领域', name:'technic.dataValue', align:"center", hidden:true},
       {label:'企业来源', name:'source.dataValue', align:"center", hidden:true},
       {label:'孵化企业', name:'incubated.title',index:'incubated', align:"center",width:60},
       {label:'孵化器配置', name:'incubationInfo.incubateConfig.dataValue',index:'incubationInfo.incubateConfig', align:"center",width:120},
    {label:'联系地址', name:'customerInfo.address', align:"center", hidden:true},
       {label:'邮编', name:'customerInfo.zipCode', align:"center", hidden:true},
       {label:'网址', name:'customerInfo.webSite', align:"center", hidden:true},
       {label:'办公电话', name:'customerInfo.officePhone', align:"center", hidden:true},
       {label:'传真', name:'customerInfo.fax', align:"center", hidden:true},
       {label:'Email地址', name:'customerInfo.email', align:"center", hidden:true},
       {label:'注册时间', name:'customerInfo.regTime', align:"center", hidden:true,formatter:'date',formatoptions:{srcformat: 'Y-m-d', newformat: 'Y-m-d'}},
       {label:'注册类型', name:'customerInfo.regType.dataValue', align:"center", hidden:true},
       {label:'注册资本', name:'customerInfo.regCapital', align:"center", hidden:true},
       {label:'币种', name:'customerInfo.currencyType.dataValue', align:"center", hidden:true},
       {label:'组织机构', name:'customerInfo.organizationNumber', align:"center", hidden:true},
       {label:'工商注册号', name:'customerInfo.businessNumber', align:"center", hidden:true},
       /* {label:'税务登记证', name:'customerInfo.taxNumber', align:"center", hidden:true}, */
       {label:'法定代表人', name:'customerInfo.legalPerson', align:"center", hidden:true},
       {label:'证件类型', name:'customerInfo.documentType.dataValue', align:"center", hidden:true},
       {label:'证件号', name:'customerInfo.documentNumber', align:"center", hidden:true},
       {label:'注册EMAIL', name:'customerInfo.regMail', align:"center", hidden:true},
       {label:'移动电话', name:'customerInfo.cellphone', align:"center", hidden:true},
       {label:'注册地址', name:'customerInfo.regAddress', align:"center", hidden:true},
       {label:'经营范围', name:'customerInfo.businessScope', align:"center", hidden:true},
       {label:'营业截至日期', name:'customerInfo.businessExpireDate', align:"center", hidden:true,formatter:'date',formatoptions:{srcformat: 'Y-m-d', newformat: 'Y-m-d'}},
       {label:'孵化日期起', name:'incubationInfo.incubationStartDate', align:"center", hidden:true,formatter:'date',formatoptions:{srcformat: 'Y-m-d', newformat: 'Y-m-d'}},
       {label:'孵化日期止', name:'incubationInfo.incubationEndDate', align:"center", hidden:true,formatter:'date',formatoptions:{srcformat: 'Y-m-d', newformat: 'Y-m-d'}},
       {label:'毕业日期', name:'incubationInfo.graduationDate', align:"center", hidden:true,formatter:'date',formatoptions:{srcformat: 'Y-m-d', newformat: 'Y-m-d'}},
       {label:'是否高新技术企业', name:'incubationInfo.highTechEnterprise.title', align:"center", hidden:true},
       {label:'是否建立创业导师', name:'incubationInfo.tutorSupport.title', align:"center", hidden:true},
       {label:'是否大学生创业', name:'incubationInfo.undergraduateEnterprise.title', align:"center", hidden:true},
       {label:'是否留学生创业', name:'incubationInfo.overseaEnterprise.title', align:"center", hidden:true},
       {label:'孵化状态', name:'incubationInfo.statusName', align:"center",width:120},
       {label:'管理', name:'manager', align:"center",width:80,sortable:false, resizable:false}
   ],
   height: height,
   width: width,
   rowNum:40,
      rowList:[40,80,160,320],
      sortable:true,
      sortname:'code',
      sortorder:'asc',
   shrinkToFit: false,
   gridComplete: function(){
    var ids = $(this).jqGrid('getDataIDs');
    for(var i = 0 ; i < ids.length; i++){
     var id = ids[i];
     var content = "";
     var row = $(this).jqGrid('getRowData',id);
     if(row.userId==''){
      content += "<img src=\"core/common/images/users.png\" width=\"14\" height=\"14\" title=\"设置账号\" onclick=\"createUser('"+id+"');\"  /> ";
     }else{
      content += "<img src=\"core/common/images/users.png\" width=\"14\" height=\"14\" title=\"修改密码\" onclick=\"updateAccountPassword('"+row.userId+"');\"  /> ";
     }
     content += "<img src=\"core/common/images/viewbtn.gif\" width=\"14\" height=\"14\" title=\"查看\" onclick=\"viewById('"+id+"');\"  /> ";
     content += "<img src=\"core/common/images/edit.gif\" width=\"14\" height=\"14\" title=\"编辑\" onclick=\"editById('"+id+"');\"  /> ";
     if(row.investmentId!=''){
      content += "<img src=\"core/common/images/view2.png\" width=\"14\" height=\"14\" title=\"项目信息\" onclick=\"viewInvestmentById('"+row.investmentId+"');\"  /> ";
     }
     content += "<img src=\"core/common/images/del.gif\" width=\"14\" height=\"14\" title=\"删除\" onclick=\"deleteById('"+id+"');\"  /> ";
     $(this).jqGrid('setRowData',id,{manager:content});
    }
   }
  }).navGrid('#pager',{add: false, edit: false, del: false, search: false}).navButtonAdd('#pager',{
      caption : "列选择",
      title : "选择要显示的列",
      onClickButton : function(){
          $(this).jqGrid('columnChooser');
      }
  });
 }

分享到:
评论

相关推荐

    jqGrid4.5.2强大的多列排序终于有了

    在`colModel`中,为每列定义`sortable`属性,设置为`true`以允许该列参与排序。 当用户点击表头时,jqGrid会触发`sortData`事件,此时可以捕获这个事件并根据用户的排序选择更新请求参数。`gridSortOrder`属性则...

    Jquery 实现列的拖动 jquery grid

    在网页开发中,jQuery Grid是一款强大的数据管理组件,它提供了丰富的功能,如数据分页、排序、搜索等。本文将详细讲解如何利用jQuery实现网格(Grid)中的列拖动功能,以及如何展示和压缩内容,以达到类似Excel的...

    jqGrid表头锁列及排序功能细节

    在本文中,我们将深入探讨jqGrid中的表头锁列和排序功能的实现细节。 一、jqGrid 添加列的大标题 jqGrid 提供了设置列组标题的功能,允许为多列设置一个共同的标题头部,提升表格的可读性。实现这一功能的代码如下...

    jqGrid_各种参数_详解

    * colModel:设置表格的列模型。 * colNames:设置表格的列名称。 * datatype:设置表格的数据类型。 * editurl:设置表格的编辑 URL。 * gridview:设置表格的 Grid 视图。 * height:设置表格的高度。 * hidegrid...

    jqgrid中文文档API

    本文将详细介绍jQgrid的中文文档API,涵盖了其原理、使用方法、参数配置、事件处理、数据处理、ColModel API等方面的知识点。 原理 jQgrid是典型的B/S架构,服务器端只是提供数据管理,客户端只是提供数据显示。...

    jqGrid 中文大全(1)

    “jqGrid基础学习:4jqGrid的ColModel API”深入探讨了ColModel,它是定义表格列属性的关键部分。通过配置ColModel,可以自定义列的宽度、对齐方式、可编辑性等特性。 5. **jqGrid中的事件**: “jqGrid基础学习...

    JqGrid中文API文档

    `colModel`是JqGrid最重要的配置之一,它定义了表格的所有列。每列都有多个属性,如`name`(列名)、`index`(索引名)、`width`(宽度)等。还可以配置列的可编辑性、隐藏性、排序方式等。 四、分页 JqGrid提供...

    jqGrid完整实例

    4. **操作功能**:jqGrid支持排序、搜索、编辑、添加和删除数据。可通过设置`sortname`和`sortorder`进行默认排序,使用`searching`选项启用搜索框,设置`editGridRow`和`addGridRow`方法实现编辑和添加功能。 5. *...

    jqgrid加载本地数据并且分页例子

    jqGrid是一款功能强大的JavaScript表格插件,用于在网页上展示并操作数据,它支持各种操作,包括数据的加载、排序、搜索以及分页等。在这个"jqgrid加载本地数据并且分页例子"中,我们将深入探讨如何利用jqGrid实现从...

    jquery.jqgrid最新版

    jqGrid是基于jQuery库的表格插件,它提供了一套完整的解决方案,包括数据的加载、排序、筛选、分页、编辑以及格式化等。jqGrid支持多种数据源,如JSON、XML、HTML、CSV等,能够无缝集成到各种Web项目中。其核心功能...

    JQGrid系列教程

    JQGrid 是一个基于 jQuery 的表格控件,它使用 AJAX 方式与服务器端通信,能够实现多种功能,如排序、过滤、分页、编辑等。下面是 JQGrid 的一些关键特点和使用方法。 JQGrid 的特点 * 外观时髦,功能齐全 * JS ...

    jqgrid序列

    - `colModel`:定义表格列的属性,如字段名、宽度、是否可编辑等。 - `pager`:分页器的ID,用于显示分页控件。 - `sortname`和`sortorder`:默认排序的列名和顺序。 - `rowList`:分页大小选项列表。 - `mtype`:...

    jqgrid4.6.rar

    6. **功能特性**:jqGrid 提供了许多内置功能,如排序(`sortable`)、分页(`pager`)、搜索(`searching`)、编辑(`editable`)、添加、删除和更新记录等。 7. **自定义行为**:通过事件监听和回调函数,可以...

    JQGrid系列教程 代码

    默认情况下,JQGrid根据`sortname`和`sortorder`进行排序。 6. **搜索功能** JQGrid支持高级搜索,可以配置`searching`参数启用搜索栏。通过`filterToolbar`或`searchGrid`方法,可以实现简单的文本搜索或复杂的...

    jqGrid表格数据展示插件

    colModel: [ // 列定义 { name: "id", index: "id", width: 50 }, { name: "name", index: "name", width: 100 }, { name: "age", index: "age", width: 70 } ], pager: "#pager", // 分页器ID rowNum: 10, /...

    jqGrid 各种参数详解

    当用户进行操作,例如排序、搜索或编辑单元格时,jqGrid 会发送请求到服务器,服务器处理这些请求并返回更新后的数据。 jqGrid 支持大量的参数定制其行为。例如: 1. `url`:string 类型,定义获取数据的服务器端...

    table表格样式利用jqgrid实现

    jqGrid是由Trirand公司开发的,基于jQuery的开源项目,它提供了数据网格的功能,支持数据分页、排序、过滤、编辑等多种操作。jqGrid的使用可以极大地提升表格的用户体验,使其在数据管理方面更加高效。 在实现表格...

    jqGrid-3.2.zip

    colModel: [ { name: 'column1', index: 'column1', width: 100 }, { name: 'column2', index: 'column2', width: 200 }, { name: 'column3', index: 'column3', width: 150 } ], pager: '#pager', // 分页...

    jqgrid_位于上端的合计行.

    总结来说,jqGrid 的上端合计行功能通过启用 `footerrow`,定义 `colModel` 的 `summaryType`,并利用 `loadComplete` 或 `gridComplete` 回调函数进行数据计算和更新,可以帮助我们快速高效地展示列表数据的总计,...

    jqgrid实现分组显示和统计

    它支持多种功能,包括数据分页、排序、搜索、编辑等。在本教程中,我们将深入探讨如何利用jqGrid实现数据的分组显示和统计,这对于数据分析和报告呈现来说尤其重要。 一、分组显示 1. 初始化jqGrid 首先,我们需要...

Global site tag (gtag.js) - Google Analytics