2

jqGrid contains action formatter and boolean posted columns. I tried to hide Delete action button for posted rows in jqGrid in loadComplete using

var iCol = getColumnIndexByName($grid, 'Posted');
$('.ui-inline-del').each(function (index) {
    var row = $grid[0].rows[index];
    if ($(row.cells[iCol]).find(">div>input:checked").length > 0) {
        $(this).hide();
    }
});

but this hides delete action button randomly in wrong rows. How to remove Delete button from rows where Posted column value is true? Oleg clickableCheckbox formatter is used in colmodel. Data is read from server in jsin format.

[{"name":"_actions",
"formatter":"actions",
,"delbutton":true,
formatoptions: {"delOptions":{"url":"Delete"}}},

{"label":null,"name":"Posted",
"edittype":"checkbox",
"editoptions":{"value":"True:False","readonly":"readonly","disabled":"disabled"},
"formatter":"clickableCheckbox",
"editable":true,"width":0,
"classes":null,"hidden":true,
}]

Adding new button after delete button

                $("<div>", {
                    title: "Custom",
                    mouseover: function () {
                        $(this).addClass('ui-state-hover');
                    },
                    mouseout: function () {
                        $(this).removeClass('ui-state-hover');
                    },
                    click: function (e) {
                        alert("'Custom' button is clicked in the rowis=" +
                          $(e.target).closest("tr.jqgrow").attr("id") + " !");
                    }
                }
          ).css({ "margin-left": "2px", float: "left" })
           .addClass("ui-pg-div ui-inline-custom")
           .append('<span class="ui-icon ui-icon-lock"></span>')
           .appendTo($(row.cells[iActionsCol]).children("div"));

shows always wrong icon

enter image description here

Andrus
  • 26,339
  • 60
  • 204
  • 378

1 Answers1

2

I think you should change the enumeration from the loadComplete to something like the following:

loadComplete: function () {
    var i, rows = this.rows, l = rows.length, row,
        iClosedCol = getColumnIndexByName($grid, 'Posted'),
        iActionsCol = getColumnIndexByName($grid, '_actions');
    for (i = 0; i < l; i++) {
        row = rows[i];
        if ($(row).hasClass('jqgrow')) {
            if ($(row.cells[iClosedCol]).find(">div>input:checked").length > 0) {
                $(row.cells[iActionsCol]).find(">div>div.ui-inline-del").hide();
            }
        }
    }
}

In the code you can be sure that you hide the "Delete" action button in exactly the same row where the 'Posted' column contains checked checkbox.

Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Thank you very much. It worked. How to add additonal Post button in addition on Delete button for unposted rows and Unpost button for posted rows? Or is it better to add separate columns for them ? Edit action is always not visible. Or is it better to replace edit action button with Post button ? – Andrus Feb 06 '12 at 15:48
  • 1
    @Andrus: You are welcome! In [the answer](http://stackoverflow.com/a/6627201/315935) I described how to add custom button which can be used like the standard "actions" buttons. I think it's what you need. – Oleg Feb 06 '12 at 15:54
  • Thank you. Adding second icon after delete icon shows wrong icon always, how to show correct icon? How to add new icon before delete icon ? I updated question. – Andrus Feb 06 '12 at 17:24
  • @Andrus: The problem is just you use more recent version of jqGrid as in [the demo](http://ok-soft-gmbh.com/jqGrid/TestSamle/Admin1.htm) - 4.1.2 which had hovering bug. You should change the code corresponds to the current code of jqGrid. You added code seems be far from your original question. The main goal of the stackoverflow to sharing questions and answers with other visitors. So it's better to divide questions in small clear parts. It helps other to find and to use the information. – Oleg Feb 06 '12 at 17:41