Kendo 网格将最小值和最大值设置到另一列

Question

我有这个网格演示，并且在检查无线电百分比的数量值时，我想实现的目标不能超过100。我已经在edit事件中创建函数以设置最大值和最小值。但它仍然无法正常工作，因为它没有获取 amount id。对如何获取 ID 有帮助吗？

var grid = $('#grid').kendoGrid({
  dataSource: dataSource,
  editable: true,
  //toolbar: [{ name: "create", text: "Add" }],
  columns: [

    { field: "name", title: "name" },

    { field: "status", title: "Status",
      template: data => data.status == "amt" ? "Amount" : "Percentage",
         editor:    "<input name='status' type='radio' data-bind='checked:status' id='perc' value='perc'>" +
                "<label>Percentage</label><br>" +
                "<input name='status' type='radio' data-bind='checked:status' id='amt' value='amt'>" +
                "<label>Amount</label>"
        },
    { field: "amount", title: "Amount",
        //template: "<div class='amount'>#: amount #</div>",
        //template: "<a href='\\#' id = '" + amount + "' class='deleteBtn'></a>",
    },
    { command: ["destroy"], title: "&nbsp;" }
  ],
  edit: function(e){


      $("#perc").click(() => {
            //alert('perc');
        if ($("#amount").val() > 100) $("#amount").val(100);
        $("#amount").attr({"max": 100, "min": 0 });
      });

      $("#amt").click(() => {
        //alert('amt');
        $("#amount").removeAttr("max");
        $("#amount").removeAttr("min");
      });


      $("input[name=amount]").change(() => {
          if ($("#perc").prop('checked')) {
          if ($("#amount").val() > 100) $("#amount").val(100);
        }
      });

  }
});

Answer 1

废弃编辑事件处理程序。

而是使用 columns.editor 函数。它获取 options.model 中的整行，因此如果 options.model.status 是百分比，则将 min 和 max 属性添加到输入中。

Kendo 网格将最小值和最大值设置到另一列

Kendo grid set min and max value to another column

javascript

jquery

kendo-ui

kendo-grid