jQuery-bootgrid模式對話框

Question

我有一個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>";
            },

我在bootgrid外面有完全相同的按鈕，單擊它會按預期顯示對話框。 任何想法在哪里查看或導致這種行為的原因是什么？

Answer 1

單擊“事件參考”打開“模態”

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

希望它有效:)

Answer 2

這是一個很好的主意，請你以腳本格式表示。 我們可以替換哪部分腳本。

這樣你就不必重新應用處理程序，如果網格頁面，並且有更少的事件處理程序（更有效）：$（'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");
    });
});