How to remove action buttons from posted rows in free jqgrid using Fontawesome checkbox formatter

Question

Free jqgrid contain boolean hidden column IsPosted defined as

    {"label":null,"name":"IsPosted",
 "edittype":"checkbox","editoptions":{"value":"True:False","readonly":"readonly","disabled":"disabled"},
"align":"center",
"formatter":"checkboxFontAwesome4",
"editable":true,
"width":0,"classes":null,
"hidden":true,"stype":"select",
"searchoptions":{"sopt":["eq","ne"],
"value":":Free;true:Yes;false:No"}
    }],

delete, edit and custom post button needs to be removed from inline actions toolbar if this column has value true. Rhis is done using method

   disableRows('IsPosted', true);

It works with Clickable checkbox formatter. If checkboxFontAwesome4 formatter is used,

            isPosted = $(row.cells[iCol]).find(">span>div>input:checked").length > 0;

is always false. I tried also

            isPosted = $(row.cells[iCol]).children("input:checked").length > 0;

but this is false for all formatters. I tried also template = "booleanCheckboxFa", instead of formatter line but this does not show fontawecome icon.

How to fix it so that it works with checkboxFontAwesome4 formatter or with all formatters ?

var disableRows = function (rowName, isBoolean) {
    var iCol = getColumnIndexByName($grid, rowName),
              cRows = $grid[0].rows.length,
              iRow,
              row,
              className,
              isPosted,
              mycell,
              mycelldata,
              cm = $grid.jqGrid('getGridParam', 'colModel'),
              iActionsCol = getColumnIndexByName($grid, '_actions'), l;
    l = cm.length;
    for (iRow = 0; iRow < cRows; iRow = iRow + 1) {
        row = $grid[0].rows[iRow];
        className = row.className;
        isPosted = false;

        if ($(row).hasClass('jqgrow')) {
            if (!isBoolean) {
                mycell = row.cells[iCol];
                mycelldata = mycell.textContent || mycell.innerText;
                isPosted = mycelldata.replace(/^\s+/g, "").replace(/\s+$/g, "") !== "";
            }
            else {
                isPosted = $(row.cells[iCol]).find(">span>div>input:checked").length > 0;
            }
            if (isPosted) {
                if ($.inArray('jqgrid-postedrow', className.split(' ')) === -1) {
                    row.className = className + ' jqgrid-postedrow not-editable-row';
                    $(row.cells[iActionsCol]).attr('editable', '0');
                    $(row.cells[iActionsCol]).find(">div>div.ui-inline-del").hide();
                    $(row.cells[iActionsCol]).find(">div>div.ui-inline-post").hide();
                    $(row.cells[iActionsCol]).find(">div>div.ui-inline-edit").hide();
                }
            }
        }
    }
};

you write about problems with `formatter: "actions"`, but you don't posted the definition of the column which uses the formater. On the other side you posted definition of the column which uses `formatter:"checkboxFontAwesome4"`, but formatters have no relation with editing. Is your question: how to test the value in `IsPosted` column? What exactly is your problem? — Oleg, Mar 30 '15 at 11:03
I need to test value of IsPosted column if `template = "booleanCheckboxFa"` if used for it. Test provided in code in queston works only in `formatter = "clickableCheckbox"` is used. — Andrus, Mar 30 '15 at 13:29

Oleg · Accepted Answer · 2015-03-30T14:41:31.123

1

I'm not sure that I correctly understand your question. Probably you want just test whether the cell row.cells[iCol] contained checked symbol (<i> with the class fa-check-square-o) or unckecked (<i> with the fa-square-o). You can just use unformatter. If you prefer low-level way like

isPosted = $(row.cells[iCol]).find(">span>div>input:checked").length > 0;

then you can use

isPosted = $(row.cells[iCol]).find("i").hasClass("fa-check-square-o");

instead.

UPDATED: One can use

var isPostedStr = $.unformat.call(this, row.cells[iCol],
        {rowId: row.id, colModel: cm}, iCol);
if (cm.convertOnSave) {
    isPosted = cm.convertOnSave.call(this, {
                   newValue: isPostedStr,
                   cm: cm,
                   oldValue: isPostedStr,
                   id: row.id,
                   //item: $grid.jqGrid("getLocalRow", row.id),
                   iCol: iCol
               });
}

where I suppose that this is equal to $grid[0] and cm is colModel[iCol]. The returned value will be the string "true" or "false" and to have boolean variable you need convert it to true or false. To be exactly the returned value depend on editoptions.value which one use. template: "booleanCheckboxFa" uses editoptions: {value: "true:false", defaultValue: "false"}. So the returned value are the string "true" or "false". If you want to make clean conversion of results to Boolean I would recommend you to look at the code of convertOnSave. I included the call of cm.convertOnSave in case if it exist. In common case one should initialize item property of the row, but simple formatters like formatter: "checkboxFontAwesome4" don't uses the value.

edited Mar 30 '15 at 14:41

answered Mar 30 '15 at 11:14

Oleg

220,925
34
403
798

Thank you. It worked. This code is called from loadComplete event. How to use unformatter instead ? Unformatter works with any formatter so it is more general. – Andrus Mar 30 '15 at 13:36
@Andrus: You are welcome! I added **UPDATED** part in my answer. – Oleg Mar 30 '15 at 14:26
jqgrid allows to add action buttons in properties according to http://www.ok-soft-gmbh.com/jqGrid/OK/CustomActionButton.htm and https://github.com/free-jqgrid/jqGrid/commit/9d838631c6c1a3809b3e61483421a77ab1740e01 Can code in question and answer still used to remove standard and custom actions buttons or is there better way ? – Andrus Apr 19 '15 at 10:52
@Andrus: Yes of cause. I try to hold the compatibility to the old versions of jqGrid as good if it possible. The main advantage of the usage of new feature is performance and of cause the simple usage. You know that formatter, custom formatters, `rowattr` and `cellattr` works very quickly together with `gridview: true` because jqGrid generate **full body of the grid as string and place it on the page as one operation**. The code from the answer **modifies** every cell of the column. Every modification follows to browser reflow to recalculate position of other elements. So old way is slowly. – Oleg Apr 19 '15 at 11:10
@Andrus: The new way allows to customize `formatter: "actions"` so that it includes custom buttons **directly** during creating the action buttons. So one needs just specify some options in `formatoptions: {...}` or in the option `actionsNavOptions`. I'm writing now new wiki article which describes the new feature in details. – Oleg Apr 19 '15 at 11:12
@Andrus: I posted the first version of the corresponding wiki article [here](https://github.com/free-jqgrid/jqGrid/wiki/Enhancement-of-formatter:%22actions%22). – Oleg Apr 19 '15 at 11:36
@Andrus: It's a good suggestion! Could you provide a practical example and I will suggest and implement additional parameters which allows to do this. In general one need to have one additional callback which could returns for example the object with Boolean `false` property (or the string `"hidden"`) which allows to remove or to hide some button. For example the callback cold get `options` with `rowid` and `rowData` as propwerties. The callback can return `{edit: false, del: true}` or `{addUser: "hidden", edit: false, del: true, addToCart: true}`. What do you think about the interface? – Oleg Apr 19 '15 at 12:01
@Andrus: About the performance: create the grid with 1000 rows (without paging) using old code and using new one and see the results. It could be TreeGrid for example, with 1000 rows loaded and only someone displayed. The usage custom buttons of `formatter: "actions"` with *modification* will be much slowly as the usage of *new options*. – Oleg Apr 19 '15 at 12:04
I posted question in http://stackoverflow.com/questions/29729911/how-to-use-free-jqgrid-properties-to-conditionally-add-actions-buttons . How to create uniform way to hide both standard edit and delete and user defined actions buttons. – Andrus Apr 19 '15 at 12:39
The other possiblility would be to extend existing `rowattr` or `cellattr` callbacks without introducing new one. – Andrus Apr 19 '15 at 13:05
@Andrus: Thank you! I understand the problem. I have to do now some other things, but I will make modification of free jqGrid later and will post the answer on your question with the corresponding demo. `rowattr ` apply setting to the whole row. `cellattr` apply settings on the whole cell. One need to apply some settings **on parts of the column**: on some buttons of the `formatter: "actions"`. So I think that it should be option of the `formatter: "actions"`. – Oleg Apr 19 '15 at 13:17
The other possibility would be to put every action button to separate column for easy cellattr usage. In this case there should be a way to remove vertical lines between columns since lined action buttons are maybe ugly. This this case every button occupies always space. For same column in may be possible to put separate buttons is same place, so maybe same column like currently is better – Andrus Apr 19 '15 at 13:32

How to remove action buttons from posted rows in free jqgrid using Fontawesome checkbox formatter

1 Answers1

Linked