Jquery 触发行选择的命令按钮

鉴于以下情况，当我单击命令按钮时，它也会触发选定的.rs

理想情况下，我希望避免行选择，但如果单击第一列中的值，则具有相同的功能

$( document ).ready(function() {
var grid = $("#my_grid").bootgrid({
ajax: true,
rowSelect: true,
selection: true,
multiSelect: false,
keepSelection: true,
post: function () {
    return {
        id: "b0df282a-0d67-40e5-8558-c9e93b7befed"
    };
},
url: "response.php",
formatters: {
    "commands": function(column, row) {
        if (row.active == "t") {
            var buttonToggle = "<button type=\"button\" class=\"btn btn-xs btn-default command-disable\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-remove-circle\"></span> Disable Zone</button>";
        } else {
            var buttonToggle = "<button type=\"button\" class=\"btn btn-xs btn-default command-enable\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-ok-circle\"></span> Enable Zone</button>";
        }

        return "<button type=\"button\" class=\"btn btn-xs btn-danger command-delete\" data-row-id=\"" + row.id + "\"><span class=\"glyphicon glyphicon-trash\"></span> Delete</button> " + buttonToggle;
    },
    "status": function(column, row) {
        if (row.active == "t") {
            return "Active";
        } else {
            return "Inactive";
        }
    },
    "link": function(column, row) {
        return "<a href=\"#\">Edit: " + row.id + "</a>";
    },
},
templates: {
    header: "<div id=\"{{ctx.id}}\" class=\"{{css.header}}\"><div class=\"row\"><div class=\"col-sm-12 actionBar\"><div class=\"{{css.search}} pull-left\"></div><div class=\"{{css.actions}}\"></div></div></div></div>"
},
labels: {
    infos: "Showing {{ctx.start}} to {{ctx.end}} of {{ctx.total}} zones"
}
}).on("loaded.rs.jquery.bootgrid", function() {
grid.find(".command-delete").on("click", function(e) {
    var conf = confirm('Delete Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'delete'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Removed');
    }
}).end();
grid.find(".command-disable").on("click", function(e) {
    var conf = confirm('Disable Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'disable'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Disabled');
    }
}).end();
grid.find(".command-enable").on("click", function(e) {
    var conf = confirm('Enable Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'enable'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Enabled');
    }
}).end();
}).on("selected.rs.jquery.bootgrid", function(e, rows) {
alert("Select: " + rows[0].id);
});

$（文档）.ready（函数（）{
var grid=$（“#我的网格”）.bootgrid({
阿贾克斯：没错，
rowSelect:true，
选择：正确，
多选：错，
基普选举：没错，
职位：职能（）{
返回{
id:“b0df282a-0d67-40e5-8558-c9e93b7befed”
};
},
url:“response.php”，
格式化程序：{
“命令”：功能（列、行）{
如果（row.active==“t”）{
var buttonToggle=“禁用区域”；
}否则{
var buttonToggle=“启用区域”；
}
返回“删除”+按钮切换；
},
“状态”：功能（列、行）{
如果（row.active==“t”）{
返回“活动”；
}否则{
返回“不活动”；
}
},
“链接”：功能（列、行）{
返回“”；
},
},
模板：{
标题：“
},
标签：{
信息：“显示{ctx.total}个区域的{{ctx.start}到{ctx.end}}”
}
}).on（“loaded.rs.jquery.bootgrid”，函数（）{
grid.find（“.command delete”）。在（“单击”上，函数（e）{
var conf=confirm（'Delete Zone ID:'+$（this）.data（“row ID”）+'？'）；
if（conf）{
$.post（'response.php'，{id:$（this.data）（“行id”），操作：'delete'}
，函数（）{
$（“#我的网格”）.bootgrid（'reload'）；
}); 
}否则{
警报（“区域ID:”+$（此）.data（“行ID”）+“未删除”）；
}
}).end（）；
grid.find（“.command disable”）。打开（“单击”，函数（e）{
var conf=confirm（'Disable Zone ID:'+$（this）.data（“row ID”）+'？'）；
if（conf）{
$.post（'response.php'，{id:$（this.data）（“行id”），操作：'disable'}
，函数（）{
$（“#我的网格”）.bootgrid（'reload'）；
}); 
}否则{
警报（“区域ID:”+$（此）.data（“行ID”）+“未禁用”）；
}
}).end（）；
grid.find（“.command enable”）。在（“单击”）上，函数（e）{
var conf=confirm（'Enable Zone ID:'+$（this）.data（“row ID”）+'？'）；
if（conf）{
$.post（'response.php'，{id:$（this.data）（“行id”），操作：'enable'}
，函数（）{
$（“#我的网格”）.bootgrid（'reload'）；
}); 
}否则{
警报（“区域ID:”+$（此）.data（“行ID”）+“未启用”）；
}
}).end（）；
}).on（“selected.rs.jquery.bootgrid”，函数（e，行）{
警报（“选择：”+行[0].id）；
});

您需要停止每个

单击处理程序中的事件传播：

.on("loaded.rs.jquery.bootgrid", function() {
grid.find(".command-delete").on("click", function(e) {

    // stop the event propagation, so the selection won't be triggered
    e.preventDefault();
    e.stopPropagation();

    var conf = confirm('Delete Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'delete'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Removed');
    }
}).end();
grid.find(".command-disable").on("click", function(e) {

    // stop the event propagation, so the selection won't be triggered
    e.preventDefault();
    e.stopPropagation();

    var conf = confirm('Disable Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'disable'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Disabled');
    }
}).end();
grid.find(".command-enable").on("click", function(e) {

    // stop the event propagation, so the selection won't be triggered
    e.preventDefault();
    e.stopPropagation();

    var conf = confirm('Enable Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'enable'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Enabled');
    }
}).end();
})

您需要停止每个
单击
处理程序中的事件传播：

.on("loaded.rs.jquery.bootgrid", function() {
grid.find(".command-delete").on("click", function(e) {

    // stop the event propagation, so the selection won't be triggered
    e.preventDefault();
    e.stopPropagation();

    var conf = confirm('Delete Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'delete'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Removed');
    }
}).end();
grid.find(".command-disable").on("click", function(e) {

    // stop the event propagation, so the selection won't be triggered
    e.preventDefault();
    e.stopPropagation();

    var conf = confirm('Disable Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'disable'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Disabled');
    }
}).end();
grid.find(".command-enable").on("click", function(e) {

    // stop the event propagation, so the selection won't be triggered
    e.preventDefault();
    e.stopPropagation();

    var conf = confirm('Enable Zone ID: ' + $(this).data("row-id") + ' ?');

    if(conf) {
        $.post('response.php', { id: $(this).data("row-id"), action:'enable'}
            , function(){
                $("#my_grid").bootgrid('reload');
        }); 
    } else {
        alert('Zone ID: ' + $(this).data("row-id") + ' Not Enabled');
    }
}).end();
})