Clearing jqGrid before loading new data not working?

Question

Hi there ^_^ I have the following problem:

I have a partial view with a jqGrid on it...and I use bPopup to display the partial view as a dialog.

Now there is a list of items on the side of the view. When clicking on an item...the dialog is to be displayed with the table displaying the data relating to that response...

Now the problem is that clicking on subsequent items; the data from the first item clicked is still showed...so I thought that simply calling

$("#ListDialogTable").jqGrid("clearGridData");

will clear the data and allow me to display the new data...but now when I try to show the dialog in subsequent clicks...only the table headers are shown...no data!

Any ideas and help on this appreciated :) D

P.s. some code; the method below is called by method ShowListDialog

function PopulateTable(model) {
    $("#ListDialogTable").jqGrid("clearGridData");
    $("#ListDialogTable").jqGrid({
        jsonReader:
        {
            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: true,
            cell: "cell",
            id: "id"
        },

        colNames: model.columnN,
        colModel: model.columnM,

        datatype: "jsonstring",
        datastr: model.columnD,

        sortname: model.sortName,
        sortorder: "asc",

        autowidth: true,
        celledit: false,
        gridview: true,
        height: "auto",
        hoverrows: false,
        shrinkToFit: true,
        rowNum: 999,
        viewrecords: true
    });
}

Can you post some HTML and javascript code? It is more helpful for us to help you — Reporter, May 06 '11 at 09:28
code added ^_^ sorry formatting did not include first and last line of code... — Dieter, May 06 '11 at 09:34
This code is executed each time the dialog needs to be shown...so i dont know if executing it over and over has a bad effect or not... — Dieter, May 06 '11 at 09:53
To format the code fragment you select your code and click on "{}" element in the toolbar. It do not much more as insert 4 blanks at the beginning of every line and insert empty row before and sometime after the selected text. If you insert the blanks manually you will have the same results. — Oleg, May 06 '11 at 11:20

score 15 · Answer 1 · edited Oct 10 '14 at 07:02

15

You can unload the jqGrid by using below method:

jQuery("#tableId").jqGrid("clearGridData");

edited Oct 10 '14 at 07:02

Andrey Korneyev

26,353
15
70
71

answered Oct 10 '14 at 06:29

vishwas

151
1
2

Thanks! Just a comment, use `jQuery("#tableId").jqGrid("clearGridData");` If you want to clear the footer too! :D – Genarito Feb 25 '22 at 00:44

score 3 · Answer 2 · answered Jul 09 '13 at 05:03

3

You can use jqgrid's GridUnload method

$("#tableId").jqGrid("GridUnload")

This will unload the entire grid and will allow you to load new data onto the grid.

answered Jul 09 '13 at 05:03

Yasser Shaikh

46,934
46
204
281

no it doesn't allow you to load new data onto the grid. you need to recreate the grid first. see Oleg's answer. – low_rents Jul 08 '15 at 11:43

score 3 · Answer 3 · edited May 23 '17 at 12:01

3

You don't posted how the element with id="ListDialogTable", which you use for the grid, are created. Will be it constructed dynamically or created once and be used many time? Moreover it is not clear whether the model.columnN and model.columnM can be changed between the calls or not. So I can only guess.

Probably you need use GridUnload method which allow you to recreate the grid including all its elements including the column headers and the pager contain. The demo from the answer demonstrate how it works.

edited May 23 '17 at 12:01

Community

1
1

answered May 06 '11 at 11:03

Oleg

220,925
34
403
798

AWESOMENESS!!!Thank you! $("#ListDialogTable").jqGrid("GridUnload"); did the trick. All I needed to do was call the above line of code in a function bound to the click event of the dialog's close button ^_^ – Dieter May 06 '11 at 12:38

score 1 · Answer 4 · answered Aug 14 '15 at 12:15

1

I have same issues because i am using older version of jqGrid and this is my solution for this:

jQuery("#grid").clearGridData(true).trigger("reloadGrid");

answered Aug 14 '15 at 12:15

Brane

3,257
2
42
53

Clearing jqGrid before loading new data not working?

4 Answers4