jQuery Grid Plugin - jqGrid - Topic: setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

heavyvice on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Tue, 17 Jan 2012 14:35:21 +0200

Frozen cols is great improvement but...We need use celledit together

There is an alternative way but I don't know how to implement...

Allocate 2 grids NO FROZEN cos, left grid contains 'fixed' cols, right grid contains all editable cols but none frozen cols.

The only problem is capture scroll event from two grids and sync both toprow

But I don't know how to do that.

Heavyvice

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Tue, 17 Jan 2012 01:37:32 +0200

FIXED! Huge thank you for your time guys.

OlegK on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Tue, 17 Jan 2012 01:30:15 +0200

Everything is easy if one can reproduce the problem.

You should remove sortable: true option from the grid to be able to use frozen columns: see the modified demo.

Look at the documentation about the limitations in the current implementation or look the line of jqGrid code.

Best regards
Oleg

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Tue, 17 Jan 2012 01:14:54 +0200

Hi Oleg,

Here is a complete dump of the Coldfusion serialized JSON data after calling my cfc:

The data loads into the grid without any problem. I hope this helps you to help me.

Thanks.

OlegK on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Tue, 17 Jan 2012 01:08:34 +0200

Hello,

the code which you posted gives not so many information because you don't posted the JSON data which can be used to reproduce your problem. The demo use datatype: 'json' and it do work.

If you post the full code which can be used to reproduce your problem one could find the reason of your problem.

Best regards
Oleg

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Tue, 17 Jan 2012 00:24:36 +0200

Hey Tony / Oleg....

Ok, Im not yet ready to give up on this. I tried your suggestion Tony and moved the $grid.jqGrid('setFrozenColumns'); within the success ajax function. It still did not work:

   $grid = $("#dataGrid"),

   fixPositionsOfFrozenDivs = function () {
       if (typeof this.grid.fbDiv !== "undefined") {
           $(this.grid.fbDiv).css($(this.grid.bDiv).position());
       }
       if (typeof this.grid.fhDiv !== "undefined") {
           $(this.grid.fhDiv).css($(this.grid.hDiv).position());
       }
   };

    $.ajax({

        type: "GET",
        url: "xxxxxx",
       dataType: "json",

        success: function(result){

var colD = result.pfcTills,
colM = result.colModelList;

           $grid.jqGrid({

               datatype: 'local',
               data: colD.gridData,
               gridview: true,
               colModel :colM,
               height: "100%",
               width: 1000,
               shrinkToFit: false,
               caption:"PFC TILLS MONTHLY SUMMARY",
               sortable: true,
               rowNum: 100,
                loadComplete: function(){

                    fixPositionsOfFrozenDivs.call(this);
               }

            });

          $grid.jqGrid('setFrozenColumns');
          $grid[0].p._complete.call($grid[0]);
          fixPositionsOfFrozenDivs.call($grid[0]);

        }// END SUCCESS

    });// END AJAX

});
</script>

I also (without changing my code) set async: false. This made no difference also.

Oleg, the first entry in my column model list from above is:

{"name":"PRDID","sortable":false,"frozen":true,"label":"Item Description","width":200.0,"editable":false,"index":"PRDID","hidden":false}

Hidden is set to false unless I am missing something? There are no hidden columns. I have since removed any reference to hidden columns anyway.

Thanks again gents!

OlegK on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 10:05:39 +0200

Hello,

I want to add one more probelm in your JSON data additionally to the problem described by Tony. The JSON data which you posted one sees that you set the property frozen:true only for hidden column. So no frozen columns will be created and so $grid[0].p._complete will be null. If you want to make your code working without errors in the situation you should use

if ($.isFunction($grid[0].p._complete)) { $grid[0].p._complete.call($grid[0]); }

In any way if you want to test setFrozenColumns method you should define at least one non-hidden column having frozen:true.

Best regards
Oleg

tony on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 09:27:29 +0200

Hello,

There is enought time to give up.

You should call these lines of code

$grid.jqGrid('setFrozenColumns');

within the success ajax function and not outside it.

$.ajax({

....

success : function (...)

{

...

$grid.jqGrid({

...

});

$grid.jqGrid('setFrozenColumns');

} // END SUCCESS

}); // END AJAX

....

If you call it so the grid is not yet constructed, since of the ajax call.

Please read carfully what ajax does.

Another simple way to fix this is to set ajax option

async: false.

without to change your code.

Baest Regards

Tony

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 01:54:32 +0200

Thanks again Oleg,

This will be my last post before I give up on this thing!

I keep getting the error $grid[0] is undefined.

Here is my final mix of your demol and my code. The grid and data loads no problem:

    $.ajax({

        type: "GET",
        url: "cfc/contacts.cfc?method=pfcTillsMonth&storeID=<cfoutput>#form.storeID#</cfoutput>&year=<cfoutput>#form.year#</cfoutput>",
       dataType: "json",

success: function(result){

var colD = result.pfcTills,
colM = result.colModelList;

   $grid.jqGrid('setFrozenColumns');
   $grid[0].p._complete.call($grid[0]);
   fixPositionsOfFrozenDivs.call($grid[0]);

});
</script>

You can see from the following dump that frozen is set in the colModel:

{"colModelList":[{"name":"PRDID","sortable":false,"frozen":true,"label":"Item Description","width":200.0,"editable":false,"index":"PRDID","hidden":false},{"name":"Jan","sortable":false,"width":100.0,"editable":false,"label":"January","align":"right"},{"name":"Feb","sortable":false,"width":100.0,"editable":false,"label":"February","align":"right"},{"name":"Mar","sortable":false,"width":100.0,"editable":false,"label":"March","align":"right"},.......

Any last suggestions please mate??

Thanks.

OlegK on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 01:00:28 +0200

Hello,

many parts of my old code which you posted will be probably not important for you. You should just define the fixPositionsOfFrozenDivs function with the code var fixPositionsOfFrozenDivs = function () { ...}; somewhere before the usage and include call of fixPositionsOfFrozenDivs.call(this); inside of loadComplete function. It's also important to call p._complete after the call of setFrozenColumns.

The most easy way is the copy my demo and modify it by removing some parts to have the simpllest, but working demo. Then you can use the same ideas in your code.

Best regards
Oleg

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 00:46:59 +0200

Hey Oleg,

Thanks for the prompt reply. I have read the links you sent me, and assume that my datatype of local is the issue. I also should say that unlike the demo, not even my header is fixed (I should also say that I do not change any of the heights or CSS).

Any chance you coul dguide me through this a bit more please? I inserted the following bwtween the brackets of my loadComplete:


 var $this = $(this), newCapture = "", filters, rules, rule, op, i, iOp,
        postData = $this.jqGrid("getGridParam", "postData"),
        isFiltering = $this.jqGrid("getGridParam", "search");

    if (isFiltering === true && typeof postData.filters !== "undefined") {
        filters = $.parseJSON(postData.filters);
        newCapture = "Filter: [";
        rules = filters.rules;
        for (i = 0; i < rules.length; i++) {
            rule = rules[i];
            op = rule.op;  // the code name of the operation
            iOp = $.inArray(op, arOps);
            if (iOp >= 0 && typeof $.jgrid.search.odata[iOp] !== "undefined") {
                op = $.jgrid.search.odata[iOp];
            }
            newCapture += rule.field + " " + op + " '" + rule.data + "'";
            if (i + 1 !== rules.length) {
                newCapture += ", ";
            }
        }
        newCapture += "]";
    }
    $this.jqGrid("setCaption", newCapture);
    fixPositionsOfFrozenDivs.call(this);

Where exactly in my code should the following go:

fixPositionsOfFrozenDivs = function () {
                    if (typeof this.grid.fbDiv !== "undefined") {
                        $(this.grid.fbDiv).css($(this.grid.bDiv).position());
                    }
                    if (typeof this.grid.fhDiv !== "undefined") {
                        $(this.grid.fhDiv).css($(this.grid.hDiv).position());
                    }
                },
                arOps = ["eq", "ne", "lt", "le", "gt", "ge", "bw", "bn", "in", "ni", "ew", "en", "cn", "nc"];

I also have this now after the last brackets of my code at the beginning of this post:

$grid = $('#dataGrid');
$grid.jqGrid('setFrozenColumns');
$grid[0].p._complete.call($grid[0]);

Cheers Oleg.

OlegK on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 00:12:07 +0200

Probably you will find the answers on your question in the answer and in this one.

Best regards
Oleg

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Mon, 16 Jan 2012 00:06:57 +0200

Tony,

I had already looked at the documentation and know what I am meant to do i.e:

jQuery("#dataGrid").jqGrid('setFrozenColumns');

frozen:true

but I can't seem to get it to work, HENCE I posted on here. It is where in my code that the line calling the method setFrozenColumns should be that is my question. I have tried it in multiple places but cant get it to work, so need to know where it SHOULD go. When I know this, if it still does not work, then I can look at other possibilities.

"mafirstlove"........ thanks for your help. Would you expect that jQuery("#dataGrid").jqGrid('setFrozenColumns'); would go at the very end of my code after the last set of brackets like in yours? The way my grid is constructed it different from yours?

Thanks.

mafirstlove on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Sat, 14 Jan 2012 12:25:57 +0200

@slykiwi you cab refer this example to freeze first column

jQuery("#UsersGrid").jqGrid({
                url: 'jqGridHandler.ashx',
                datatype: 'json',
                height: 250,
                colNames: ['UserID', 'UserName', 'FirstName', 'MiddleName', 'LastName', 'EmailID'],
                colModel: [
                        { name: 'UserID', index: 'UserID', width: 100, sortable: true, frozen: true },
                        { name: 'UserName', width: 100, sortable: true },
                        { name: 'FirstName', width: 100, sortable: true },
                        { name: 'MiddleName', width: 100, sortable: true },
                        { name: 'LastName', width: 100, sortable: true },
                        { name: 'EmailID', width: 150, sortable: true }
                    ],
                rowNum: 100,
                rowList: [200, 400, 600],
                pager: '#UsersGridPager',
                sortname: 'UserID',
                viewrecords: true,
                shrinkToFit: false,
                width: 300,
                sortorder: 'asc',

                caption: 'JSON Example'
            });

            jQuery("#UsersGrid").jqGrid('navGrid', '#UsersGridPager');

            jQuery("#UsersGrid").jqGrid('setFrozenColumns');

tony on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Fri, 13 Jan 2012 10:41:21 +0200

Hello,

I preffer you to click on the documentation menu

Kind Regards

slykiwi on setFrozenColumns HELP!!!!!!!!!!!!!! PLEASE!!!!!!!!!!!!

Fri, 13 Jan 2012 06:47:00 +0200

Hi....someone, please!!

I am trying to freeze my first grid column but with no luck. I have version 4.3, and I have frozen:true in my dynamic column model. What I cent seem to be able to do is call the method correctly. WHERE and HOW in my code below do I place the call to setFrozenColumns???

    $.ajax({

        type: "GET",
        url: "xxxxxxxxxxx",
       dataType: "json",

        success: function(result){

           var colD = result.pfcTills,
           colM = result.colModelList;

           $("#dataGrid").jqGrid({

               datatype: 'local',
               data: colD.gridData,
               gridview: true,
               colModel :colM,
               height: "100%",
               width: 1000,
               shrinkToFit: false,
               caption:"MONTHLY SUMMARY",
               sortable: true,
               rowNum: 100,
                loadComplete: function(data){ }
               }
            });
        }
    });
});
</script>

Does anyone know the answer please?

Thanks.