【问题标题】:how to remove delete action icon from confirmed order rows in jqGrid if clickableCheckbox formatter is used如果使用 clickableCheckbox 格式化程序,如何从 jqGrid 中确认的订单行中删除删除操作图标
【发布时间】:2012-02-27 01:47:18
【问题描述】:

jqGrid 包含动作格式化程序和布尔发布列。 我试图在loadComplete 中隐藏 jqGrid 中已发布行的删除操作按钮

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();
    }
});

但这会将删除操作按钮随机隐藏在错误的行中。 如何从 Posted 列值为 true 的行中删除 Delete 按钮? 在 colmodel 中使用了 Oleg clickableCheckbox 格式化程序。以jsin格式从服务器读取数据。

[{"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,
}]

删除按钮后添加新按钮

                $("<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"));

总是显示错误的图标

【问题讨论】:

    标签: javascript jqgrid


    【解决方案1】:

    我认为您应该将枚举从 loadComplete 更改为类似以下内容:

    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();
                }
            }
        }
    }
    

    在代码中,您可以确保将“删除”操作按钮隐藏在“已发布”列包含选中复选框的完全相同的行中。

    【讨论】:

    • 非常感谢。有效。如何在未发布行的删除按钮和已发布行的取消发布按钮上添加额外的发布按钮?还是为它们添加单独的列更好?编辑操作始终不可见。还是用发布按钮替换编辑操作按钮更好?
    • @Andrus:不客气!在the answer 中,我描述了如何添加可以像标准“动作”按钮一样使用的自定义按钮。我认为这是您需要的。
    • 谢谢。删除图标后添加第二个图标总是显示错误的图标,如何显示正确的图标?如何在删除图标之前添加新图标?我更新了问题。
    • @Andrus:问题只是你使用了更新版本的 jqGrid,如the demo - 4.1.2 中存在悬停错误。您应该更改代码对应于 jqGrid 的当前代码。您添加的代码似乎与您最初的问题相去甚远。 stackoverflow 的主要目标是与其他访问者共享问题和答案。所以最好把问题分成清晰的小部分。它有助于其他人查找和使用信息。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-06-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多