jqGrid Checkbox column

Question

I have a fairly complex grid with two columns formatted as a checkbox. Those columns are defined as follow:

{ name: 'Alert_A', index: 'Alert_A', width: 22, align: 'center', sortable: false,
    formatter: CheckBoxFormatter, editable: true, edittype: 'checkbox', editoptions: {value: "True:False"}, 
    formatoptions: {disabled: false}, classes: "Alert_A" },
{ name: 'Alert_B', index: 'Alert_B', width: 22, align: 'center', sortable: false,
    formatter: CheckBoxFormatter, editable: true, edittype: 'checkbox', editoptions: { value: "True:False" },
    formatoptions: {disabled: false}, classes: "Alert_B" }

The custom formatter CheckBoxFormatter is needed because I need to setup the disabled attribute of each checkbox depending on some custom rules, so I borrowed the native 'checkbox' formatter and added my custom rules.

I also have an external html button element and when I click on it I need to execute some code depending on which combination of checkbox selection have been made. My code looks like this:

$('#btnAlert').button().click(function (event) {
    event.preventDefault();
    var dashboardID = '#<%=dashboard.ClientID %>';
    doWork(dashboardID);
});

and later on the doWork function

var keys = $(dashboardID).getDataIDs();
for (var i = 0; i < keys.length; i++) {
    var rowData = $(dashboardID).getRowData(keys[i]);
    ...
    var reminderA = $(rowData.Alert_A).is(":checked");
    var reminderB = $(rowData.Alert_B).is(":checked");
    ...
    ... other application logic here
}

Unfortunately I am experiencing the fact that the value of reminderA and reminderB variables does not reflect the exact state of the checkboxes but instead does always reflect the state of their initial values (e.g. when they have been loaded by the jqgrid plugin). In other words those values does'nt get updated when the user clicks on a checkbox in the grid.

Is this the right way to achieve my result or I have to use different code? Any help?

Thanks a lot!

Which version of jqGrid and which version of jQuery you use? Do you need to have rowids of all checked buttons or you need do something in every row, but need to do just different work depend on the checkstate? Your problem can be definitively be solved. I ask additional questions only to make the code better from the performance point of view. — Oleg, Dec 21 '11 at 15:43
Hi Oleg, thanks for your answer. I am using version 4.2.0 of the plugin. I shall iterate every grid row and do something depending on both checkboxes state. — Lorenzo, Dec 21 '11 at 16:08

score 5 · Accepted Answer · edited May 23 '17 at 12:00

5

The problem which you have can be explained very easy. You use enabled checkboxes ( formatoptions:{disabled: false}), so the user are able to change state of the checkboxes. The problem is that you use your custom CheckBoxFormatter instead of original 'checkbox' formatter. The method getRowData which you use try to call unformatter which you not defined. So the value for the checkbox will be get using $(cellval).text() (see the source code of unformatter) and will be always empty.

So if you define your custom formatter and use methods like getRowData you have to define unformatter too.

In your case you don't need to use custom formatter at all. What you need is just to define disabled="disabled" attribute for some checkboxes depend on some custom rules. So you want define only the formatter for the attributes. The cellattr (see here and here examples of the usage and my original feature request) is very simple to use and it's exactly what you need. For example it could be like the following

cellattr: function (rowId, value, rawObject) {
    if (rawObject.deliveryStatus !== "sent") {
        return '';
    } else {
        return ' disabled="disabled"';
    }
}

In the case you can use the original checkbox formater and unformatter and all will work correctly.

edited May 23 '17 at 12:00

Community

1
1

answered Dec 22 '11 at 10:48

Oleg

220,925
34
403
798

just a dumb question Oleg. Later in my code I am using the call to `getRowData` to get the value of the checkbox. This works very well as per your suggestion. However I should also access the value of the disabled attribute. How I can do this? – Lorenzo Jan 11 '12 at 15:20
@Lorenzo: Which problems you have with the usage of `getRowData`? Do you use not the standard 'checkbox' formatter like I recommended? If you still use custom formatter, that you have to use custom unformatter too to have correct values returned by `getRowData`. – Oleg Jan 11 '12 at 15:31
I am using your suggestion so I removed the custom formatter. I need to get not only the cell value but also its disabled status. Please let me know if it's more clear now – Lorenzo Jan 11 '12 at 15:36
@Lorenzo: The value `rowData.Alert_A` should be string which contain `"True"` or `"False"` (I mean that `var rowData = $(dashboardID).getRowData(keys[i]);`). – Oleg Jan 11 '12 at 15:43
Yes, that is correct. But I would like to know also if that checkbox is disabled or not. How I can do this? – Lorenzo Jan 11 '12 at 15:45
@Lorenzo: Do you know the rowid and you need to verify whether the checkboxs in columns 'Alert_A' and 'Alert_B' are disabled or not? Or you have some other information as rowid as the input? – Oleg Jan 11 '12 at 15:52
Yes I have the rowId. I have tried doing `$(dashboardID).jqGrid ('getCell', keys[i], 'Alert_A');` but this also return just `true` or `false`... – Lorenzo Jan 11 '12 at 15:55
@Lorenzo: Rowid is just the id of the `` - row element. The row element contains `` - cells elements. In your case the row `Alert_A` has the class `Alert_A`. So you can use for example `$("#"+rowid+' td.Alert_A')` to get the corresponding cell with the checkbox. So to test it you can use `$("#"+rowid+'>td.Alert_A>input:checkbox').is(":checked")` to test whether the checkbox is checked and `$("#"+rowid+'>td.Alert_A>input:checkbox').is(":disabled")` to test whether the checkbox is disabled. – Oleg Jan 11 '12 at 16:06
Hi, unfortunately does not seems to work! The selector works as expected and I am able to see that select correctly each checkbox. But when I do `.is(':disabled')` I get always false. If I try to do `.attr('disabled')` I get undefined. I can't understand it why! – Lorenzo Jan 11 '12 at 16:46
Ok. I have found the problem. The `cellattr` function apply the attribute exactly on the `` so the exact way is to check if the TD has been disabled. Using your sample would be `$("#"+rowid+'>td.Alert_A').is(":disabled")` (I have just removed the last selector...). Thanks a lot!!! :D – Lorenzo Jan 11 '12 at 17:51
@Lorenzo: Ohhh, yes! I'm sorry. Of course we use `cellattr` which set attributes on the *cell* and not on the checkbox in the cell. So to test on "disabled" one should use `$("#"+rowid+'>td.Alert_A').is(":disabled")`. I didn't tested this, but I am sure that it will work. – Oleg Jan 11 '12 at 18:07
1

@Lorenzo: I didn't refreshed the page before posting the answer. You found it yourself. Fine! – Oleg Jan 11 '12 at 18:08

score 0 · Answer 2 · answered Dec 22 '11 at 07:35

0

I suppose that you have the script that binds '#btnAlert' and doWork() in document.ready, I faced such a problem and had to place the bind the functionality with inline script after initialising the jqgrid. please tell me if it works!

answered Dec 22 '11 at 07:35

Yazan Malkawi

501
4
10

Not in my case. Your assumption is correct anyway, I actually bind `btnAlert` on `document.ready`. – Lorenzo Dec 23 '11 at 12:46

jqGrid Checkbox column

2 Answers2

Linked