Question

我正在使用jqGrid，我在网格中添加了一列复选框，但我想提醒我选中了哪个复选框..这是我的代码

＆＃13;

dataGrid.prototype = {

    display: function () {
        var self = this;
        var html = [];
        var check = 0;
        html.push("<table id='" + this.id + "" + "'class='table'>\n</table>");
        html.push("<div id='pagger_" + this.id + "'></div>");
        $('body').append(html.join(""));
        $("#" + this.id).jqGrid({
            url: "index.jsp",
            styleUI: 'Bootstrap',
            datatype: "local",
            data: this.data,
            colModel: this.getColModels(this.data[0]),
            onSelectRow: this.editRow,
            viewrecords: true,
            width: 1300,
            height: 250,
            rowNum: 50,
            pager: "#pagger_" + this.id,
            loadComplete: function () {
                var iCol = self.getColumnIndexByName('Enable');
                var rows = $("#" + this.id).jqGrid('getGridParam', 'data');
                var i;
                var c = rows.length;
                for (i = 0; i < c; i += 1) {
                    $(rows[i].cells[iCol]).click(
                        function (e) {
                            var id = $(e.target).closest('tr')[0].id, isChecked = $(e.target).is(':checked');
                            alert("checked:" + isChecked);
                            // you can also get the
                            // values of the row
                            // data
                            alert('clicked on the checkbox in the row with id=' + id + '\nNow the checkbox is ' + (isChecked ? 'checked' : 'not checked'));
                        });
                }
            }
        });
    },

    getColNames: function (data) {
        var keys = [];
        for (var key in data) {
            if (data.hasOwnProperty(key)) {
                keys.push(key);
            }
        }
        return keys;
    },

    getColModels: function (data) {
        var colNames = this.getColNames(data);
        var colModelsArray = [];
        var str2;
        for (var i = 0; i < colNames.length; i++) {
            var str1;

            str1 = {
                name: colNames[i],
                index: colNames[i],
                align: 'center',
                editable: true,
                edittype: "text",
            };
            colModelsArray.push(str1);
        }
        str2 = {
            name: 'Enable',
            index: 'Enable',
            formatter: 'checkbox',
            editable: true,
            edittype: 'checkbox',
            width: 60,
            align: 'center',
            formatoptions: {
                disabled: false
            },
            editoptions: {
                value: '1:0'
            },
        };
        colModelsArray.push(str2);
        return colModelsArray;
    },

    getColumnIndexByName: function (columnName) {
        var cm = $("#" + this.id).jqGrid('getGridParam', 'colModel'), i, l;
        for (i = 0, l = cm.length; i < l; i += 1) {
            if (cm[i].name === columnName) {
                return i;
            }
        }
        return -1;
    },

};

＆＃13;

提示..

数据是json对象
每当我打印行[i]它给我[对象对象]

这里有什么问题？

Answer 1

您可以信任委派，而不是为每个复选框添加处理程序。我们假设您将一个ID放入容器，例如#containerDataGrid：

$("#containerDataGrid").on("click", "input[type=checkbox]", function(e){
  var $this = $(this); //this is the checkbox
  //this is more reliable than e.target, 
  // because it DOES point to the input not some child it could have
  var $row = $this.closest("tr"); //in case the rows are tr. If not, change by the class or parameter identifying a row


  var id = $row.attr("id"); //here's the ID you want! :D


  console.log("The checkbox in the row: ",$row, " which has id= ", id, " is " $this.is(":checked")?"checked":"not checked");
});

如果您只想获得某个特定的复选框，可以使"input[type=checkbox]"选择器更具体，例如添加一个类：

"input[type=checkbox].the-checkbox-I-want"

或确保它是包装器的子项：

".wrapper-of-my-beloved-checkbox > input[type=checkbox]"

获取点击复选框的jqGrid行的ID

1 个答案: