zoukankan      html  css  js  c++  java
  • jqGrid 跨页选择以及回显的处理

    思路:定义全局的array(selectedIds),当列表选中的时候就push进去,当列表取消选中时,将该项从selectedIds中删除

    重点:1.列表加载完成时为列表增加复选框,并给每一个checkbox赋name;

               2.回显时模拟checkbox的click事件;

    代码如下:

    var selectedIds = [];
    $(function () {
        InitChooseCourseList();
        //绑定搜索
        $("#SearchCourseForChoose").click(function () {
            SearchForChoose();
        });
    });
    
    //页面列表初始化
    function InitChooseCourseList() {
        var $gridList = $("#gridList");
        var postData = $('#CourseForm').formSerialize();
        var classId = $("#ClassId").val();
        postData["ClassId"] = classId;
        $gridList.Grid({
            mtype: 'Post',
            postData: postData,
            url: "/TopOnline/Class/ChooseCourseGrid",
            height: ($(window).height() - 145),
            colModel: [
                { label: 'ID', name: 'ID', hidden: true },
                { label: 'CourseSubjectId', name: 'CourseSubjectId', hidden: true },
                { label: '课程名称', name: 'Name',  fixJqgridColumnWidthByPercent(0.45), align: 'center' },
                { label: '所属科目', name: 'CourseSubjectName',  fixJqgridColumnWidthByPercent(0.45), align: 'center' }
            ],
            pager: '#gridPager',
            viewrecords: true,
            multiselect: true,
            //为表格增加复选框
            gridComplete: function () {
                var rowIds = jQuery("#gridList").jqGrid('getDataIDs');
                for (var k = 0; k < rowIds.length; k++) {
                    var curRowData = jQuery("#gridList").jqGrid('getRowData', rowIds[k]);
                    var curChk = $("#" + rowIds[k] + "").find(":checkbox");
                    curChk.attr('name', 'check_box_' + curRowData['ID']);   //给每一个checkbox赋名字
                    curChk.attr('value', curRowData['ID']);   //给checkbox赋值
                    curChk.attr('style', 'margin:7px;');
                }
            },
    //加载完成模拟复选框的点击事件 loadComplete:
    function (xhr) { var rowArray = xhr.rows; if (selectedIds.length > 0) { var count = 0; $.each(rowArray, function (i, item) { if (selectedIds.indexOf(item.ID.toString()) > -1) { //判断arrayNewList中存在item.Id值时,选中前面的复选框, $("[name='check_box_" + item.ID + "']").trigger('click'); count++; } }); if (rowArray.length == count) { $("#cb_gridList").prop("checked", true); } } },
    //全选触发事件 onSelectAll:
    function (aRowids, status) { var rowData = $(this).jqGridRowValue();//操作行 var pageRowData = $(this).getRowData();//当前列表所有行 if (status == true) { //循环aRowids数组,将Id放入selectedIds数组中 saveData(rowData); } else { deleteIndexData(rowData, pageRowData); } },
    //选中某行触发事件 onSelectRow:
    function (aRowids, status) { var rowData = $(this).jqGridRowValue();//操作行 var pageRowData = $(this).getRowData();//当前列表所有行 if (status == true) { if (rowData.length == $(this)[0].rows.length - 1) { $("#cb_gridList").prop("checked", true); } saveData(rowData); } else { deleteIndexData(rowData, pageRowData); } } }); }; //将Id放入selectedIds数组中 function saveData(obj) { $.each(obj, function (i, item) { if (selectedIds.indexOf(item.ID) < 0) selectedIds.push(item.ID); }); } //将Id从selectedIds中删除 (仅删除当前页面列表中的数据) function deleteIndexData(obj,pageObj) { var rowDataIds = []; var pageRowDataIds = []; $.each(obj, function (i, item) { rowDataIds.push(item.ID); }); $.each(pageObj, function (i, item) { pageRowDataIds.push(item.ID); }); $.each(selectedIds, function (i, sItem) { if (pageRowDataIds.indexOf(sItem)>0 && rowDataIds.indexOf(sItem) < 0) { selectedIds.splice(i, 1); i--; } }); }

    辅助代码:

    $.fn.jqGridRowValue = function () {
        var $grid = $(this);
        var selectedRowIds = $grid.jqGrid("getGridParam", "selarrrow");
        var json = [];
        var rowData;
        if (selectedRowIds != "") {
            var len = selectedRowIds.length;
            for (var i = 0; i < len; i++) {
                rowData = $grid.jqGrid('getRowData', selectedRowIds[i]);
                json.push(rowData);
            }
        } else {
            if (!!$grid.jqGrid('getGridParam', 'selrow')) {
                rowData = $grid.jqGrid('getRowData', $grid.jqGrid('getGridParam', 'selrow'));
                json.push(rowData);
            }
        };
        return json;
    }
  • 相关阅读:
    Git 修改已提交的commit注释
    设置git bash中显示行号等
    JS 获取字符串长度
    泛型接口
    约束
    泛型方法
    泛型
    重载运算符
    自定义转换
    装箱和拆箱
  • 原文地址:https://www.cnblogs.com/teng-0802/p/10905384.html
Copyright © 2011-2022 走看看