如何在Jsgrid中设置复选框的不确定状态

时间:2017-12-22 16:22:43

标签: jsgrid

我正在使用此库Lightweight Grid jQuery Plugin。我的一个列有复选框我想显示复选框的不确定状态,如果值为""。我试图通过jquery将checkbox的属性设置为true但是它不起作用可以任何一个显示如何在这个库中执行它。

1 个答案:

答案 0 :(得分:1)

以下是fiddle link我做过的事情

  $("#jsGrid").jsGrid({
  height: 300,
  width: "100%",

  paging: true,
  autoload: true,

  pageSize: 5,

  controller: {
    loadData: function() {
      return data;
    }
  },

  fields: [{
    name: "Name",
    type: "textarea",
    width: 150
  }, {
    name: "Married",
    title: "Is Married",
    align: "center",
    itemTemplate: function(value, item) {
      return $("<input>").attr("type", "checkbox")
        .attr("checked", function() {
          if (value === false) {
            item.uncheck = true;
            item.uncheck = item.indeterminate = false;
            $(this).prop("checked", false);
          } else if (value === true) {
            $(this).prop("checked", true);
            item.checked = true;
            item.uncheck = item.indeterminate = false;
          } else {
            item.indeterminate = true;
            item.checked = item.uncheck = false;
            $(this).prop("indeterminate", true);
          }
        })
        .on("click", function() {
          if (item.uncheck === true && item.checked === false && item.indeterminate === false) {
            item.indeterminate = true;
            item.uncheck = item.checked = false;
            $(this).prop("indeterminate", true);
          } else if (item.uncheck === false && item.checked === false && item.indeterminate === true) {
            item.checked = true;
            item.uncheck = item.indeterminate = false;
            $(this).prop("checked", true);
          } else {
            item.uncheck = true;
            item.indeterminate = item.checked = false;
            $(this).prop("checked", false);
          }
        });
    }
  }, {
    type: "control"
  }]
});

Solution