微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在 JsGrid 中只选中一个复选框

如何解决在 JsGrid 中只选中一个复选框

我正在使用 JsGrid 并且在 atm 中工作正常。

关于这个例子http://js-grid.com/demos/(批量删除场景)

在这个例子中,我只对复选框功能感兴趣

如何只允许选中一个复选框并获取选中的复选框的值?

$("#jsGrid").jsGrid({
    height: "50%",width: "100%",autoload: true,confirmDeleting: false,paging: true,controller: {
        loadData: function() {
            return db.clients;
        }
    },fields: [
        {
            headerTemplate: function() {
                return $("<button>").attr("type","button").text("Delete")
                        .on("click",function () {
                            deleteSelectedItems();
                        });
            },itemTemplate: function(_,item) {
                return $("<input>").attr("type","checkBox")
                        .prop("checked",$.inArray(item,selectedItems) > -1)
                        .on("change",function () {
                            $(this).is(":checked") ? selectItem(item) : unselectItem(item);
                        });
            },align: "center",width: 50
        },{ name: "Name",type: "text",width: 150 },{ name: "Age",type: "number",width: 50 },{ name: "Address",width: 200 }
    ]
});


var selectedItems = [];

var selectItem = function(item) {
    selectedItems.push(item);
};

var unselectItem = function(item) {
    selectedItems = $.grep(selectedItems,function(i) {
        return i !== item;
    });
};

var deleteSelectedItems = function() {
    if(!selectedItems.length || !confirm("Are you sure?"))
        return;

    deleteClientsFromDb(selectedItems);

    var $grid = $("#jsGrid");
    $grid.jsGrid("option","pageIndex",1);
    $grid.jsGrid("loadData");

    selectedItems = [];
};

var deleteClientsFromDb = function(deletingClients) {
    db.clients = $.map(db.clients,function(client) {
        return ($.inArray(client,deletingClients) > -1) ? null : client;
    });
};

提前致谢

问候

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。