扩展jqGrid.自订参数 [英] Extending of jqGrid. Custom parameter

问题描述

我想在一页上使用几个jqGrid.所有网格都将具有特定的功能.因此，我想扩展jqgrid

  $.jgrid.extend({cVal:否，cSetVal:函数(值){var $ t = this;$ t.cVal =值;console.log('设置cVal');返回这个；}，cGetVal:函数(值){var $ t = this;console.log('获取cVal');返回$ t.cVal;}，}); 

页面加载后，我使用Firefox控制台进行测试

 >>>$('#some-selector').jqGrid.cVal;错误的 

因此jqGrid返回默认值；

 >>>$('#some-selector').jqGrid('cSetVal'，'abc');设置cVal//console.log返回对象[table#some-selector.some-class] 

当我浏览到对象时，cVal为'abc'

但是

 >>>$('#some-selector').jqGrid('cGetVal'，'abc');获取cVal//console.log返回错误的 

现在再次获得默认值:(如何获得cSetVal方法中设置的值?

解决方案

对不起，但我并不完全理解扩展jqGrid"的目标.如果您需要使用jqGrid保留一些其他信息，则可以使用标准jqGrid参数列表中未包含的其他参数.例如，如果您要使用

创建网格

 <代码> $('#some-selector').jqGrid({url:"someUrl"，数据类型:"json"，...//其他标准jqGrid参数cVal:否，cSetVal:函数(值){console.log('cSetVal');}); 

您将能够使用 $('#some-selector').jqGrid('getGridParam'，'cVal'); 和 $('#some-selector').jqGrid('getGridParam'，'cSetVal'); 或仅使用 $('#some-selector')[0] .p.cVal 和$('#some-selector')[0] .p.cSetVal .我认为您实际上并不需要任何 cSetVal 或 cGetVal 函数，而是可以使用 getGridParam 和 setGridParam .

要更改 cVal 选项的值(如果它是用绝对方式定义的，则可以使用)

 <代码> $('#some-selector').jqGrid('setGridParam'，{cVal:true}); 

或仅使用

 <代码> $('#some-selector')[0] .p.cVal = true; 

或者，您可以使用 jQuery.data 来存储与关联的任何数据$('#some-selector').

如果您需要以 $('#some-selector').jqGrid('cSetVal'，值)； .答案显示了这种实现的示例，并讨论了该方法的一些优点和缺点.

已更新:因此，如果您确实需要使用 $('#some-selector').jqGrid('cSetVal'，value)之类的语法，; ，那么您应该将代码修改为

 <代码> $.jgrid.extend({cSetVal:函数(值){console.log('设置cVal');$(this).jqGrid('setGridParam'，{cVal:value});返回这个；}，cGetVal:函数(值){console.log('获取cVal');返回$(this).jqGrid('getGridParam'，'cVal');}}); 

如果需要为网格初始化一些 cVal 值，则只需在创建jqGrid的选项列表中包括 cVal :

 <代码> $('#some-selector').jqGrid({url:"someUrl"，数据类型:"json"，...//其他标准jqGrid参数cVal:true//这里); 

更新2 :如果您定义了我在回答的第一部分中建议的方法，则应通过以下方式使用这些方法:

  var $ grid = $('#some-selector');//创建网格$ grid.jqGrid({url:"someUrl"，数据类型:"json"，...//其他标准jqGrid参数cVal:否，cSetVal:函数(值){console.log('in cSetVal()');//this.p.cVal = value;$(this).jqGrid('setGridParam'，{cVal:value});}，cGetVal:function(){console.log('in cGetVal()');//返回this.p.cVal;返回$(this).jqGrid('getGridParam'，'cVal');});//现在我们可以使用cVal，cSetVal和cGetValvar cSetVal = $ grid.jqGrid("getGridParam"，"cSetVal")，cGetVal = $ grid.jqGrid("getGridParam"，"cGetVal")，cVal = $ grid.jqGrid("getGridParam"，"cVal");//获取cVal值cSetVal.call($ grid [0]，true);//更改cVal值cVal = $ grid.jqGrid("getGridParam"，"cVal");//获取修改后的cVal值cSetVal.call($ grid [0]，false);//更改cVal值cVal = cGetVal.call($ grid [0]);//获取修改后的cVal值 

I want to use several jqGrids on one page. All grids will have specific functionality. For this reason I want to extend jqgrid

$.jgrid.extend({
    cVal: false,
    cSetVal: function(value) {
        var $t = this;

        $t.cVal = value;
        console.log('Setting cVal');
        return this;
    },
    cGetVal: function(value) {
        var $t = this;
        console.log('Getting cVal');

        return $t.cVal;
    },
});

After loading of page, I use Firefox console to test

>>> $('#some-selector').jqGrid.cVal;

false

So jqGrid returns default value;

>>> $('#some-selector').jqGrid('cSetVal', 'abc');

Setting cVal //console.log returns
Object[table#some-selector.some-class]

When I browse to Object cVal is 'abc'

But

>>> $('#some-selector').jqGrid('cGetVal', 'abc');

Getting cVal //console.log returns

false

now get defaul value again :( How could I get value which was set in cSetVal method?

解决方案

Sorry, but I don't full understand the goal of "extending of jqGrid". If you need to hold some additional information with jqGrid you can just use additional parameters which is not in the list of standard jqGrid parameters. For example if you would create the grid using

$('#some-selector').jqGrid({
    url: "someUrl",
    datatype: "json",
    ... // other standard jqGrid parameters
    cVal: false,
    cSetVal: function(value) {
        console.log('cSetVal');
    }
);

you will be able to access to the parameters using $('#some-selector').jqGrid('getGridParam', 'cVal'); and $('#some-selector').jqGrid('getGridParam', 'cSetVal'); or just using $('#some-selector')[0].p.cVal and $('#some-selector')[0].p.cSetVal. I think that you don't really need any cSetVal or cGetVal functions and can use getGridParam and setGridParam instead.

To change the value of cVal option if it's defined in the abave way you can use

$('#some-selector').jqGrid('setGridParam', {cVal: true});

or just use

$('#some-selector')[0].p.cVal = true;

Alternatively you can use jQuery.data to store any data associated with $('#some-selector').

$.jgrid.extend is helpful if you need to have new methods which you need call in the form $('#some-selector').jqGrid('cSetVal',value);. The answer shows an example of such implementation and discuss a little advantages and disadvantages of the approach.

UPDATED: So if you really need to use the syntax like $('#some-selector').jqGrid('cSetVal',value); then you should modify your code to

$.jgrid.extend({
    cSetVal: function(value) {
        console.log('Setting cVal');

        $(this).jqGrid('setGridParam', {cVal: value});
        return this;
    },
    cGetVal: function(value) {
        console.log('Getting cVal');

        return $(this).jqGrid('getGridParam', 'cVal');
    }
});

If you need initialize some cVal value for the grid you need just include cVal in the list of option of jqGrid during creating of it:

$('#some-selector').jqGrid({
    url: "someUrl",
    datatype: "json",
    ... // other standard jqGrid parameters
    cVal: true // HERE
);

UPDATED 2: If you defines methods like I suggested in the first part of my answer you should use the methods in the following way:

var $grid = $('#some-selector');

// create the grid
$grid.jqGrid({
    url: "someUrl",
    datatype: "json",
    ... // other standard jqGrid parameters
    cVal: false,
    cSetVal: function(value) {
        console.log('in cSetVal()');

        //this.p.cVal = value;
        $(this).jqGrid('setGridParam', {cVal: value});
    },
    cGetVal: function() {
        console.log('in cGetVal()');

        //return this.p.cVal;
        return $(this).jqGrid('getGridParam', 'cVal');
    }
);

// now we can use cVal, cSetVal and cGetVal
var cSetVal = $grid.jqGrid("getGridParam", "cSetVal"),
    cGetVal = $grid.jqGrid("getGridParam", "cGetVal"),
    cVal = $grid.jqGrid("getGridParam", "cVal"); // get cVal value
cSetVal.call($grid[0], true); // change cVal value
cVal = $grid.jqGrid("getGridParam", "cVal");// get modified cVal value
cSetVal.call($grid[0], false);// change cVal value
cVal = cGetVal.call($grid[0]);// get modified cVal value

这篇关于扩展jqGrid.自订参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！