jQuery Grid Plugin - jqGridForum

Topic RSS

templates for columns in colModel

14/11/2010
17:21

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

Hello Tony!

I suggest very simple change in the grid.base.js. It will allows to reduce the code of jqGrids. I suggest to insert between the lines 11 and 12

$.extend($.jgrid,{
htmlDecode : function(value){

the following code

$.extend($.jgrid,{
   defaults : {
   cmTemplate: {
       align: 'left',
       sorttype: 'text',
       stype: 'text',
       edittype: 'text',
       width: 150,
       resizable: true,
       search: true,
       sortable: true,
       title: true,
       viewable: true
       }
   },
   htmlDecode : function(value){

Now we can replace line 852

var i, dir,ts;

to the following

var i,dir,ts,colMod=this.p.colModel,cmLength=colMod.length,cm;
for (i=0;i<cmLength;i++){
   cm = colMod[i];
   cm = $.extend(cm, $.jgrid.defaults.cmTemplate, cm.template || {});
   cm.index = cm.index || cm.name;
   cm[i] = cm;
}

Now a lot of colModel from jqGrids can be simplified. For example the column model from the jqGrid Demo "Neu in Version 3.7″, "Add/edit/delete on local data" can be simplified to the following

$.extend($.jgrid.defaults.cmTemplate, { editable:true });
var numberTemplate = {width:80,align:"right",editrules:{number:true},sorttype:'number',formatter:'number'};
jQuery("#crud").jqGrid({
colModel:[
   {name:'id', width:55, editoptions:{readonly:true}, sorttype:'int'},
   {name:'invdate', width:90, sorttype:'date', editrules:{date:true},
   formatter:'date', datefmt:'d/m/Y'},
   {name:'name',index:'name asc, invdate', width:100 },
   {name:'amount',template:numberTemplate },
   {name:'tax',template:numberTemplate },
   {name:'total',template:numberTemplate },
   {name:'note', width:150, sortable:false }
]
…

The code will be more short and more easy to read.

Moreover I included in the suggested code changes the setting of index property if it is not yet set. It allows to make the usage of this property more easy (instead of permanent usage of code like ts.p.colModel[i].index || ts.p.colModel[i].name).

I use for example checkboxs in the jqGrid in one of the projects. The following template would be very helpfull

var checkboxTemplate = { width: 20, formatter: 'checkbox', align: 'center',
   edittype: 'checkbox', editoptions: { value: "1:0″ },
   stype: 'select',
   searchoptions: { value: ":;1:Yes;0:No",
   sopt: ['eq', 'ne'] }}

Best regards

Oleg

25/11/2010
14:03

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

Hi Tony,

You don't comment my suggestion about the introducing if templates in the jqGrids. In my opinion it could be a very helpful feature of the jqGrid.

For example some people want to use right or center alignment in the most columns, other people don't want to have any sortable columns (see my answer on the stackoverflow.com). One use typically the same column definition parameters for all grid column having the same type like date or checkboxes. It is clear that there are a lot of examples where one can make the grid definition more simple and clear read after introducing of the templates.

The usage of templates for the colModel seems to me so native for jqGrid, that already one versions later after the introducing of the templates everybody will think that the templates were in the jqGrid starting from its first version.

What is your opinion about this subject?

What think other jqGrid users about this subject?

Best regards
Oleg

05/12/2010
12:50

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Oleg,

Thanks again for all the improvements.

Let me comment some things.

The grid base code grow and I do not like this to happen.

If I look into the default setting in cmTemplate it seems like all of these are set into the grid by default, so there is no need to repeat them again.

So I will accept this feature only in the second part. There is no need to define defauts: { cmTemplate...}, but just only to define tempate property in colModel.

Kind Regards and Thanks again

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

05/12/2010
14:13

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

Hello Tony,

thank you for you answer.

I want only explain why I suggested about having both per column template cm.template and the global template $.jgrid.defaults.cmTemplate.

Of cause all settings can be done with cm.template only, but there are one small problem. The default setting for cmTemplate, which I included in my suggestion, are really already set into the grid by default. It's correct, but the settings are done in different places of jqGrid code and the defaults can not be changed. For example what if somebody just want to have right alignment for all columns or if he want to switch off the sorting or the resizing of the columns, or to switch off the cells tooltips or just change default width of all columns to another value as 150px? One can of cause create some column templates and place the corresponding setting in all the column template definition, but is it not more elegant to be able to change/overwrite a global jqGrid setting in one line of JavaScript code?

I write all this not to make more pressure on you. No way! You should decide yourself what you want to implement in the next version of the jqGrid. I wanted only be sure that you understand my logic and my suggestion absolutely correct.

Best regards
Oleg

05/12/2010
15:08

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Oleg,

Good arguments.

Also code is changed.

Best regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.