Click here to Skip to main content
15,891,427 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
How to freeze or frozen first 2 column in jqgrid.?
my code is below and it's all working fine. but i have to set fix position of first two columns using freeze or frozen properties so please help thanks in advance..

C#
function loadGrid() {
            $("#loading").show();
            $.ajax({
                type: "POST",
                url: "BranchMasterReport.aspx/LoadData",
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                async: true,
                success: function (result) {
                    result = result.d;
                    if (result == "empty") {
                        showMsg("no records found.!", "error");
                        $("#loading").fadeOut("slow");
                        return;
                    }
                    jQuery("#grid").jqGrid({
                        datatype: "local",
                        colNames: ['BRANCH_ID'
                                    , 'Branch Name'
                                    , 'Branch Type'
                                    , 'Branch Type'
                                    , 'Branch Code'
                                    , 'Address'
                                    , 'Email'
                                    , 'Telephone No'
                                    , 'Pincode'
                                    , 'State'
                                    , 'City'
                                    , 'Remark'
                                    , 'Entry Date'
                                    , 'STATE_ID'
                                    , 'CITY_ID'
                                    , 'MAIN_BRANCH_ID'
                        ],
                        colModel: [
                                    { name: "BRANCH_ID", key: true, index: "BRANCH_ID", sortable: false, hidden: true, frozen: true },
                                    { name: "BRANCH_NAME" ,sortable: false, frozen: true},
                                    { name: "BRANCH_TYPE", hidden: true },
                                    { name: "SUB_BRANCH_TYPE", align: "left", width: 200 },
                                    { name: "BRANCH_CODE", width: 100 },
                                    { name: "ADDRESS", width: 400 },
                                    { name: "EMAIL", width: 280 },
                                    { name: "TELEPHONE_NO", width: 100, align: "center" },
                                    { name: "PINCODE", width: 70, align: "center" },
                                    { name: "STATE", align: "center", width: 85 },
                                    { name: "CITY" },
                                    { name: "REMARK", sortable: false, width: 250 },
                                    { name: "ENTRYDATE", align: "center", width: 90 },
                                    { name: "STATE_ID", index: "STATE_ID", sortable: false, hidden: true },
                                    { name: "CITY_ID", index: "CITY_ID", sortable: false, hidden: true },
                                    { name: "MAIN_BRANCH_ID", index: "MAIN_BRANCH_ID", sortable: false, hidden: true }
                        ],
                        data: JSON.parse(result),
                        rowNum: 20,
                        modal: true,
                        jsonReader: { repeatitems: true },
                        shrinkToFit: false,
                        frozenColumns : true,
                        //ReorderCoulmns : true,
                        //excel: true,
                        ignoreCase: true,
                        // forceFit: true,
                        hidegrid: false,
                        emptyrecords: "No records to view",
                        multiselect: true,
                        rownumbers: true,
                        //gridview: true,
                        loadonce: true,
                        rowList: [20, 50, 100],
                        pager: "#pager",
                        //viewrecords: true,
                        autowidth: true,
                        //sortname: 'BRANCH_NAME',
                        //sortorder: "asc",
                        //height: Math.max(0, document.documentElement.clientHeight - 300),
                        height: 'auto',
                        width: 'auto',
                        altRows: true,
                        hoverows: true,
                        //search: true,
                        //toppager: false,
                        //cloneToTop: true,
                        sortable: true,
                        //sortable: {
                        //    update: function (perm) {
                        //        if (perm) {
                        //            $("#grid").jqGrid("remapColumns", perm, true);
                        //            var colModels = $("#grid").getGridParam("colModel");
                        //        }
                        //    }
                        //},
                        autoencode: true,
                        pagerpos: 'center',
                        loadtext: "Loading...",
                        caption: 'Branch Master Report',
                        loadui: 'block'
                    });
                    $('#grid').jqGrid('navGrid', '#pager', {
                        edit: false,
                        add: false,
                        del: false,
                        search: false,
                        searchtext: "Search",
                        addtext: "Add",
                        edittext: "Edit",
                        deltext: "Delete",
                        cloneToTop: false
                    }, {}, {}, {}, { multipleSearch: false, closeAfterSearch: true, closeOnEscape: true });
                    $("#grid").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn", overlay: false });
                    jQuery("#grid").triggerHandler("jqGridAfterGridComplete");
                    jQuery("#grid").jqGrid('setFrozenColumns');
                },
                error: function (error) {
                    alert(error.d);
                    $("#loading").fadeOut("slow");
                }
            });
            $("#loading").fadeOut("slow");
        }
Posted

1 solution

 
Share this answer
 
Comments
[no name] 3-Jan-15 4:26am    
hello,
thank you for solution, but i try this all links tutorial and i get solution and apply so problem is a jqgrid table header cell is freeze and contain column are moving. so please give some customize solution for this problem.

thank you.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900