首页 > 网站 > WEB开发 > 正文

KenDoGrid中字段动态可编辑

2024-04-27 15:17:22
字体:
来源:转载
供稿:网友

<div id="grid"></div><script>$("#grid").kendoGrid({  columns: [    { field: "id", hidden:true},    { field: "choose", title:"请选择", values:[{text:"姓名",value:1},{text:"年龄",value:2}]},    { field: "name" },    { field: "age" },    { command: "edit" }  ],  dataSource: {    data: [      {  name: "Jane Doe", age: 30 },      {  name: "John Doe", age: 33 }    ],    schema: {      model: {        id: "id",        fields: {          choose: {},          name:{},          age:{type:"number"}        }      }    }  },  editable: {			mode: "inline"		},  toolbar:["create"],  edit: function(e) {    e.container.find("input[name=name]").kendoAutoComplete();    e.container.find("input[name=name]").removeClass("k-autocomplete");    var name = e.container.find("input[name=name]").data("kendoAutoComplete");    var age = e.container.find("input[name=age]").data("kendoNumericTextBox");    name.enable(false);    age.enable(false);    $("select[name='choose']").eq(0).change(function(e){      if(e.target.value == 1){        name.enable(true);        age.enable(false);      }      if(e.target.value == 2){        name.enable(false);        age.enable(true);      }    })  }});</script>


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表