3

我有一个 jQuery-bootgrid,如主页上的示例中所述。在最后一列中,我有两个用于编辑/删除行内容的按钮。

我要做的就是在用户单击删除按钮时显示一个模式对话框。但是,单击时没有任何反应。没有错误,没有警告,什么都没有。

这是 bootgrid 命令部分的代码:

"commands": function(column, row) {
                return "<button type=\"button\" class=\"btn btn-sm btn-primary command-edit\" data-row-id=\"" + row.EventId + "\"><span class=\"icon glyphicon glyphicon-pencil\"></span>@Translator.TranslateGlobal(Keys.Global.Edit)</button> " +
                    "<button class=\"btn-default btn\" data-content-close=\"Close\" data-content-id=\"Div\" data-content-save=\"Save\" data-target=\"#6698CB2F-2948-45D9-8902-2C13A7ED6335\" data-title=\"Title\" data-toggle=\"modal\" type=\"button\">Show modal</button>";
            },

我在引导网格之外有完全相同的按钮,单击它会按预期显示对话框。任何想法在哪里看或导致这种行为的原因是什么?

4

2 回答 2

3

点击事件参考打开模态

  formatters: {
            "commands": function (column, row) {
                return "<button type=\"button\" class=\"btn btn-xs btn-default command-edit\"  data-toggle=\"modal\" data-target=\"#confirmation\"><span class=\"fa fa-pencil\"></span></button> " +
                    "<button type=\"button\" class=\"btn btn-xs btn-default command-delete\" ><span class=\"fa fa-trash-o\"></span></button>";
            }
        }
    }).on("loaded.rs.jquery.bootgrid", function () {
        /* Executes after data is loaded and rendered */
        $(this).find(".command-delete").click(function (e) {
            $($(this).attr("data-target")).modal("show");
        });
    });

希望它有效:)

于 2015-06-16T19:37:54.030 回答
-1

这是一个好主意,请您以脚本格式显示。我们可以替换脚本的哪一部分。

这样,如果网格页面,您不必重新应用处理程序,并且事件处理程序更少(更有效): $('table').on("click",".command-delete", function( e){ console.log('你的东西发生在这里'); }); – 菲尔 6 月 26 日

 formatters: {
        "commands": function (column, row) {
            return "<button type=\"button\" class=\"btn btn-xs btn-default command-edit\"  data-toggle=\"modal\" data-target=\"#confirmation\"><span class=\"fa fa-pencil\"></span></button> " +
                "<button type=\"button\" class=\"btn btn-xs btn-default command-delete\" ><span class=\"fa fa-trash-o\"></span></button>";
        }
    }
}).on("loaded.rs.jquery.bootgrid", function () {
    /* Executes after data is loaded and rendered */
    $(this).find(".command-delete").click(function (e) {
        $($(this).attr("data-target")).modal("show");
    });
});
于 2018-09-10T09:40:46.037 回答