javascript - jqGrid reload grid - Stack Overflow

admin管理员组

文章数量:1200364

It's an addition for previous my question about adding columns into jqGrid-based table. Here my new js-code:

var col_names = ['First', 'Second', 'Third', 'Fourth', 'Fifth'];
var col_model = [
      {name:'invid', index:'invid', width:100}, 
      {name:'invdate', index:'invdate', width:90}, 
      {name:'amount', index:'amount', width:80, align:'right'}, 
      {name:'tax', index:'tax', width:80, align:'right'}, 
      {name:'total', index:'total', width:80, align:'right'}, 
];

function createGrid()
{
  var handle = $("#list").jqGrid({
    url:'data.xml',
    datatype: 'xml',
    mtype: 'GET',
    colNames: col_names,
    colModel : col_model,
  }); 
}

Now I call createGrid(); after document is loaded, everything works fine. Now I want to add a new column (with empty data) and reload jqGrid:

  $("#add_column").click(function() {
        $('#list').trigger("DestroyGrid"); // Also tried UnloadGrid

        col_names.push('New');
        col_model.push({name: 'test', index: 'test', width: 100});

        createGrid(); // And recreate grid
  });

But nothing happens, why?

---

UPD

  $("#add_column").click(function() {
        col_names.push('New');
        col_model.push({name: 'test', index: 'test', width: 100});

        $('#list').trigger("reloadGrid");
  });

The same situation

---

UPD2 I tried these:

ajaxGridOptions: {cache: false},
loadonce:false

Didn't change the situation.

It's an addition for previous my question about adding columns into jqGrid-based table. Here my new js-code:

var col_names = ['First', 'Second', 'Third', 'Fourth', 'Fifth'];
var col_model = [
      {name:'invid', index:'invid', width:100}, 
      {name:'invdate', index:'invdate', width:90}, 
      {name:'amount', index:'amount', width:80, align:'right'}, 
      {name:'tax', index:'tax', width:80, align:'right'}, 
      {name:'total', index:'total', width:80, align:'right'}, 
];

function createGrid()
{
  var handle = $("#list").jqGrid({
    url:'data.xml',
    datatype: 'xml',
    mtype: 'GET',
    colNames: col_names,
    colModel : col_model,
  }); 
}

Now I call createGrid(); after document is loaded, everything works fine. Now I want to add a new column (with empty data) and reload jqGrid:

  $("#add_column").click(function() {
        $('#list').trigger("DestroyGrid"); // Also tried UnloadGrid

        col_names.push('New');
        col_model.push({name: 'test', index: 'test', width: 100});

        createGrid(); // And recreate grid
  });

But nothing happens, why?

---

UPD

  $("#add_column").click(function() {
        col_names.push('New');
        col_model.push({name: 'test', index: 'test', width: 100});

        $('#list').trigger("reloadGrid");
  });

The same situation

---

UPD2 I tried these:

ajaxGridOptions: {cache: false},
loadonce:false

Didn't change the situation.

• javascript
• jqgrid

Share Improve this question Follow edited Oct 2, 2016 at 14:29 Brian Tompsett - 汤莱恩 5,8837272 gold badges6161 silver badges133133 bronze badges asked Nov 20, 2010 at 11:20 Max FraiMax Frai 64.3k8181 gold badges201201 silver badges311311 bronze badges 1

• ajaxGridOptions: {cache: false} and loadonce:false are default settings they can not help. If yo answer helps you not, please post the full code example with HTML code and test XML which you use and I modify it to make it working. – Oleg Commented Nov 20, 2010 at 13:47

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 15

You can do about following

var counter=1; // to be able to click more then one time
$("#add_column").click(function() {
    $("#list").jqGrid('GridUnload');

    col_names.push('New'+counter);
    col_model.push({name: 'test'+counter, index: 'test'+counter, width: 100});
    counter++;

    createGrid();
});

try not to Destroy/Create, but .trigger("reloadGrid");

UPD:: try to pass loadonce:false to grid creation params

UPD2:: Seemed like jQgrid cant operate with column changes "On fly". Try to destroy first grid and create another one instead of it.

本文标签： javascriptjqGrid reload gridStack Overflow