Sorting a column display hidden rows in jqGrid

Question

I have some rows I hide like that:

$("#"+rowid).hide();

My problem is that when the user clicks to sort a colmun, the hidden rows reappeared. There is a way to avoid this?

EDIT

I will try to explain a little bit more what I did with code example. I start to create my grid with this params (and without datas).

var params = {
    datatype: "local",
    data: [],
    caption: "Grid",
    colNames:[ "Column A", "Column B" ],
    colModel:[
        { name:"colA", key: true },
        { name:"colB" } 
    ]
};

For some reasons, I reload next the grid with datas, like this:

$("#myGrid").jqGrid("clearGridData")
        .jqGrid("setGridParam", { data: myDatas })
        .trigger("reloadGrid");

And I have checkboxes with listeners, like this one:

$("#checkbox1").on("change", onCheckbox1Changed);

function onCheckbox1Changed() {
  var rowid = ...;
  var datas = $("#myGrid").jqGrid("getRowData");

  for(var key in datas) {
    if(datas[keys].colB === "" && $("#checkbox1").val() === true) {
      $("#"+rowid).show();
    } else if(datas[keys].colB === "" && $("#checkbox1").val() === false) {
      $("#"+rowid).hide();
    }
  }
}

This code works like I want. Rows are hidden/shown depending on checkboxes. The problem is when I clik on a column to sort it, the hidden columns reappeared.

EDIT 2

I could force the grid to hide the rows after a sort. But I didn't find where I can find an event like "afterSort". There is "onSortCol" but it is called before the sort.

A solution will be to force that using "loadComplete". Like this:

var params = {
   // ...
   loadComplete: onLoadComplete
}

function onLoadComplete() {
    onCheckbox1Changed();
}

I tried it and it works. But I am not very "fan" with this solution.

Which criteria you use to choose the rows, which you need to hide? Where you get/hold the corresponding rowids? In which part of your code you hide the rows? Which version of jqGrid you use (can use) and from which fork of jqGrid ([free jqGrid](https://github.com/free-jqgrid/jqGrid), commercial [Guriddo jqGrid JS](http://guriddo.net/?page_id=103334) or an old jqGrid in version <=4.7)? — Oleg, Jan 27 '17 at 12:58
What is about your code and another questions which I asked you? — Oleg, Jan 27 '17 at 13:02
Sorry I pressed "enter" to return to the line and so the comment was post. Anyway (and sorry for my bad English). I have checkboxes which permit to display rows on certain conditions (example: hiding rows if the field "name" is empty). I hide the rows in the listener' checkboxes. — Stalyon, Jan 27 '17 at 13:05
The English is not a problem. I'm sure that I can help you, but you should post some code which allow to understand what you do. In general you can hold the list of ids of hidden rows as a new custom option of jqGrid. You can use `rowattr` to hide the rows. It's all. If it's not clear enough, then you should append some fragments of your code, which demonstrates what you do. I could modify the code to show what I mean. — Oleg, Jan 27 '17 at 13:09
Thank you for your return. I edited my question with some code. — Stalyon, Jan 27 '17 at 13:33
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/134191/discussion-between-stalyon-and-oleg). — Stalyon, Jan 27 '17 at 14:01

score 1 · Accepted Answer · answered Jan 29 '17 at 12:44

I find hiding some rows after displaying the page of data not the best choice. The main disadvantage is the number of rows which will be displayed. You can safe use $("#"+rowid).hide(); method inside of loadComplete only if you need to display one page of the data. Even in the case one can see some incorrect information. For example, one can use viewrecords: true option, which place the text like "View 1 - 10 of 12" on right part of the pager.

I personally would recommend you to filter the data. You need to add search: true option to the grid and specify postData.filters, which excludes some rows from displaying:

search: true,
postData: {
    filters: {
        groupOp: "AND",
        rules: [
            { field: "colA", op: "ne", data: "rowid1" },
            { field: "colA", op: "ne", data: "rowid2" }
        ]
    }
}

If you would upgrade from old jqGrid 4.6 to the current version (4.13.6) of free jqGrid, then you can use "ni" (NOT IN) operation:

search: true,
postData: {
    filters: {
        groupOp: "AND",
        rules: [
            { op: "ni", field: "id", data: "rowid1,rowid2" }
        ]
    }
}

In both cases jqGrid will first filter the local data based on the filter rules and then it will display the current page of data. As the result you will have the perfect results.

Sorting of such grid will not not change the filter.

score 0 · Answer 2 · edited May 23 '17 at 11:53

0

Don't hide columns after the creation of the table, hide them directly when you create the grid using the option hidden, like this:

 colNames: ['Id', ...],
 colModel: [
    { key: true, hidden: true, name: 'Id', index: 'Id' },
    ....
 ]

If you want to hide columns on particular events after the creation of the grid, look at this article.

Hope it was you were looking for.

edited May 23 '17 at 11:53

Community

1
1

answered Jan 27 '17 at 11:08

Dr. Roggia

1,095
3
16
40

Thank you for your answer. But it's not columns I hide, it's rows. I hide it depending on some events. – Stalyon Jan 27 '17 at 12:38

Sorting a column display hidden rows in jqGrid

2 Answers2