1

Though I have spent a lot of time on looking for similar QA here but Can't able to find out. If You think that I missed checking something please let me know.

question metadata:
So I am using free jqGrid 4.15.4 for showing data in view. I am able to do all things with awesome documentation. but one certain condition where I am not getting about steps.

In my grid, I have 4 columns named as Id, Name, Group, and Status. Group(Section A/ Section B....) are coming from database. Status(New/Pass /Fail) column consist dropdown and by default value is "New" for all records.

question statement :

There are 5 records and I have Selected "Pass" status for 2 out of 5. Now I want to see all 5 records if I select "New" in filter toolbar for that particular group(section A). Since I don't how many names belongs to that particular group, so I want to check this by filtering all records with "New" status. Is this possible with jqgrid? StudentGrid.png

Here is the code snippet:

$("#grid").jqGrid({
    url: '/StudentsView/GetAllData',
    mtype: "GET",
    datatype: "json",
    colNames: ['Id','Name', 'Group','Status'],
    colModel: [
                {label: "Id",name: 'Id',hidden: true,search: false,key:true},
                {label: "Name",name: 'Name', search: true, stype: 'text'},
                {label: "GroupNo",name: 'GroupNo',searchoptions: {searchOperators: true,sopt: ['eq', 'cn', 'nc'] }, search: true, multipleSearch: true, multipleGroup:true},
                {
                    label: "Status",
                    name: 'Status',
                    cellEdit: true,
                    edittype: 'select',
                    editable: true,
                    editoptions: {
                    value: getStatusOptions(),
                    dataEvents: [{
                        type: 'change',
                        fn: function (e) {
                        if (statusid != 0) 
                            {
                                ChangeStatus(row.Id, row.Name, row.Group, statusid);                       
                            }
                        }
                    }],
                    }
                }
    pager: jQuery('#pager'),
    loadonce: true,
    viewrecords: true,
    gridview: true,
    iconSet: "fontAwesome",
    emptyrecords: "No records to display",
    jsonReader:
    {
        root: "rows",
        page: "page",
        total: "total",
        records: "records",
        repeatitems: false,
        Id: "Id"
    }
});
$('#grid').jqGrid('filterToolbar', { stringResult: true,searchOnEnter:false, defaultSearch: "cn", multipleSearch: true, searchOperators: true, 
search: true, loadFilterDefaults: true });
$('#grid').jqGrid('navGrid', "#pager", {
    search: false, // show search button on the toolbar
    add: false,
    edit: false,
    del: false,
    refresh: true
});

I have added a diagram for better understanding. Thanks in Advance.

Chandan
  • 217
  • 1
  • 3
  • 17
  • Could you fix the code posted in the question? It contains clear syntax error: the part of `colModel`, which defined `Status` column is missing. Instead of that one can see some part of code (near `if (statusid != 0)`), which origin is unclear. It would be helpful if you prepare a demo (in JSFiddle, for example), which reproduce the problem. You can remove or simplify all not really required parts of your code (calls of `ChangeStatus`, `bootbox.confirm` and so on) to demonstrate your main problem only. I still not sure: do you want to display the data filtered by `Status="New"` on load? – Oleg Jul 22 '18 at 11:53
  • Additionally it would be helpful if you post an example of test response returned from `'/StudentsView/GetAllData'`. The data, which corresponds the picture, could be for example: `[{"Id":101, "Name": "ABC", "GroupNo": "Sec A", "Status": "Pass"},{"Id":102, "Name": "DEF", "GroupNo": "Sec A", "Status": "Pass"},{"Id":103, "Name": "XYZ", "GroupNo": "Sec A", "Status": "New"},{"Id":104, "Name": "SVZ", "GroupNo": "Sec A", "Status": "Fail"},{"Id":105, "Name": "WDM", "GroupNo": "Sec B", "Status": "New"}]`. – Oleg Jul 22 '18 at 11:56
  • JSFiddle allows to use Echo service. [The old answer](https://stackoverflow.com/a/49340184/315935) for example provides https://jsfiddle.net/Lae6kee7/23/ demo, which uses the Echo service in combination with jqGrid. One need just use jqGrid options `url: "/echo/json/", datatype: "json", mtype: "POST", postData: { json: JSON.stringify(mydata) }`, where `mydata` is the object with the data, which returns the server (`'/StudentsView/GetAllData'` in your case). Having working demo one can understand your problem very easy and modify it to demonstrate the solution of your problem. – Oleg Jul 22 '18 at 12:00
  • Hello Oleg, Thanks for pitching in. I have now changed the code as suggested. My question is **" How I can get all records for a specific group if I select Status "New"? "** At first time of loading grid all status is "New", but that can be changed to either **"Pass"** or **Fail**. So say for example 3 out 5 records are changed to "Pass/Fail", having group "Sec A" and Now I am filtering out status column with **"New"** column, then I want to see all 5 records for that specific group "Sec A" in search result. Does this statement helped you? – Chandan Jul 23 '18 at 09:28
  • I'm not sure that I correctly understand the problem. I don't understand how the data can be changed because you don't use any editing mode in jqGrid. I repeat that you posted *not full code*. The definition of `Status` column is unclear for me (see calls of `getStatusOptions` and `ChangeStatus` with other undefined variables `row.Id, row.Name, row.Group, statusid`). I suppose that you implemented some login, which is wrong. I'd recommend you to examine the demo https://jsfiddle.net/OlegKi/su7ebs65/ – Oleg Jul 23 '18 at 14:43

0 Answers0