0

I have more than one jqGrids on my page. These were created dynamically. I want to get the caption of the grid from row click. I see setCaption method but no getCaption. So was wondering if there is a good way to get this value?

I didn't find any helpful link here in SO or outside. Appreciate any help.

UPDATE:

@Oleg's solution helped me to fix the issue, his comment on how to find the grid id made me re-think about my problem and got the solution:

zLoadLabResult() generates grid dynamically. And when user clicks on the checkbox, I wanted to know the caption of the grid for some other logic that i am building.

function zLoadLabResults(fulldata) {
    fulldata = $.parseJSON(fulldata);
    $.each(fulldata, function (i, item) {
        var data = item.resultData;
        var colNames = item.colNames;

        var colModelsArray = [];
        for (var i = 0; i < colNames.length; i++) {
            var str;
            if (i === 0) {
                str = {
                    name: 'id',
                    width: 25,
                    editoptions: { value: "True:False" },
                    editrules: { required: true },
                    edittype: 'checkbox',
                    formatter: zCheckboxFormatter,
                    formatoptions: { disabled: false },
                    editable: true,
                    sortable: false
                };
            } else {
                str = {
                    name: colNames[i],
                    index: colNames[i],
                    width: '100px'
                };
            }
            colModelsArray.push(str);
        }

        var gridName = "grid-" + item.testName;
        $("#gridcontainer").append("<table id='grid-" + item.testName + "' class='grid'></table>");

        $("#" + gridName).jqGrid({
            //url: "user.json",
            //datatype: "json",
            datatype: "local",
            colNames: colNames,
            colModel: colModelsArray,
            height: "auto",
            width: "auto",
            caption: item.testName
        });

        var names = colNames;
        var mydata = [];

        for (var i = 0; i < data.length; i++) {
            mydata[i] = {};
            for (var j = 0; j < data[i].length; j++) {
                mydata[i][names[j]] = data[i][j];
            }
        }

        for (var i = 0; i <= mydata.length; i++) {
            $("#" + gridName).jqGrid('addRowData', i + 1, mydata[i]);
        }
        for (var i = 0; i <= colNames.length; i++) {
            $("#" + gridName).jqGrid("setLabel", colNames[i], "", { "text-align": "left" });
        }
    });
};

function zCheckboxFormatter(cellvalue, options, rowObject) {
    return '<input type="checkbox" class="selectedId" name="Id-' + cellvalue + '">';
};

I have the following event hooked to checkbox that does the trick by adding Oleg's solution:

$('table[id^="grid-"]').on("click", "td > input", function (e) {
    var grid = "#" + $(e.target).closest("table").attr("id");
    var caption = $(grid).jqGrid("getGridParam", "caption");

    var checked = $(e.target).is(":checked")

    var rowId = $(e.target).closest("tr").attr("id")
    rowData = $(grid).getRowData(rowId);        
});
Sri Reddy
  • 6,832
  • 20
  • 70
  • 112

1 Answers1

2

If you don't make any manual manipulations of the content of the grid caption then you just use caption option for every grid. You can get the caption of every grid using getGridParam:

var caption1 = $("#grid1").jqGrid("getGridParam", "caption");

If you want to access the caption on the low level then you can use the following

var caption1 = $($("#grid1")[0].grid.cDiv).children("span.ui-jqgrid-title").html();
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • but `#grid1` is dynamic for me. It gets generated in runtime. I only know about the row that I select. Am I missing something? – Sri Reddy Mar 29 '16 at 13:47
  • @SriReddy: Could you post some code fragments, which you use? The statement "I only know about the row that I select." could be interpreted in many ways, moreover every grid holds separate list of selected rows. I wrote `$("#grid1")` to point on one specific grid from which you want to get the caption. If you have the reference to one grid in another variable then you can use the variable instead of `$("#grid1")`. If need to get caption from all jqGrids on the page, it's no problem too. You need just formulate clear what you do and what you need. – Oleg Mar 29 '16 at 14:25
  • Thanks Oleg. You made me think hard and I was able to get the id from my click event. This line of code determines the grid id: `var grid = "#" + $(e.target).closest("table").attr("id");`. And, it just worked. For other's I have added the code (which I should have done before) and the solution too. – Sri Reddy Mar 29 '16 at 15:00
  • @SriReddy: You are welcome! It would be helpful if you would post the code which you use. I suppose that you use jqGrid not in optimal way. How you register the click event handler? Typically one don't need register anyone because of event bubbling. The `click` handler on the whole grid get the information on every click inside of jqGrid. Thus one uses typically `beforeSelectRow` callback. `this` in the callback is already the table and `this.id` is the id. The `e.target` still point to the clicked element and one can get the cell, the row, the rowid and so on. The code is simple and clear. – Oleg Mar 29 '16 at 16:26
  • @SriReddy: About the code, which you posted. First of all I'd recommend you to use the latest version (4.13.1) of [free jqGrid](https://github.com/free-jqgrid/jqGrid) - the fork, which I develop. Seconds, you should never fill `index` property of `colModel`, remove `width: '100px'`, which is wrong (correct would be integer value `width: 100`). No `colNames` is required too. You should **never ever** fill the data using `addRowData`. It's the most slow way of filling which I know. Instead of that one can use `data: mydata` which **fills the grid during creating**. I can continue... – Oleg Mar 29 '16 at 16:33
  • @SriReddy: One more remark. It's bad to fill `id` column with `true` and `false` value. Id means unique values. By the way [the demo](http://www.ok-soft-gmbh.com/jqGrid/EditableCheckbox1.htm) created for [the answer](http://stackoverflow.com/a/24239416/315935) demonstrates how to implement editing of checkboxes. – Oleg Mar 29 '16 at 16:38