如何解决设置剑道网格列的剑道开关asp.net mvc
我试图在asp.net MVC中包含剑道网格的剑道开关,如以下屏幕截图
在此处尝试遵循this kendo forum article
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
...
...
{ field: "discontinued",width: "70px",template: "<input class='customClass' #if (discontinued) { # checked='checked' # } # type='checkBox' />",editor: customEditor },{command: "edit",width: "100px"}],editable: "inline",cancel: function(e) {
var grid = this;
var rowUid = e.container.data("uid");
setTimeout(function() {
createSwitch(grid.element.find("tr[data-uid='"+rowUid+"'] .customClass"));
});
},dataBound: function() {
createSwitch(this.tbody.find(".customClass"));
}
});
function createSwitch(element) {
element.kendoMobileSwitch({
onLabel: "YES",offLabel: "NO",change: onChange
});
}
function onChange(e) {
var row = e.sender.element.closest("tr");
var grid = $("#grid").getKendoGrid();
var dataItem = grid.dataItem(row);
var checked = e.checked;
dataItem.set("discontinued",checked);
// sync data with remote service
grid.dataSource.sync();
}
function customEditor(container,options) {
$('<input type="checkBox" name="' + options.field + '"/>')
.appendTo(container)
.kendoMobileSwitch({
onLabel: "YES",offLabel: "NO"
});
}
});
</script>
我只是尝试按照以下方式将this example (jquery)解决方案转换为ASP.NET MVC
剃刀区
columns.Bound(c => c.discontinued).ClientTemplate("<input class='customClass' #if (discontinued) { # checked='checked' # } # type='checkBox' />");
脚本
<script type="text/javascript">
$(document).ready(function () {
$('.spinner').css('display','block');
setTimeout(function () {
$('.spinner').css('display','none');
var grid = this;
var rowUid = e.container.data("uid");
createSwitch(grid.element.find("tr[data-uid='" + rowUid + "'] .customClass"));
},1000);
function createSwitch(element)
{
element.kendoMobileSwitch({
onLabel: "YES",change: onChangeSwitch
});
}
function onChangeSwitch(e)
{
var row = e.sender.element.closest("tr");
var grid = $("#grid").getKendoGrid();
var dataItem = grid.dataItem(row);
var checked = e.checked;
dataItem.set("discontinued",checked);
// sync data with remote service
grid.dataSource.sync();
}
function customEditor(container,options) {
$('<input type="checkBox" name="' + options.field + '"/>')
.appendTo(container)
.kendoMobileSwitch({
onLabel: "YES",offLabel: "NO"
});
}
</script>
但是此 与asp.net MVC的jQuery 对话无法正常工作,感谢您提出任何使之可行的建议。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。