Question

我正在使用JCery（KendoGrid）使用MVC构建应用程序来显示数据，一切都按照要求正常运行，后来我们计划在网格的每一行上添加带按钮的额外列，听起来很简单，但尝试过数字添加到应用程序中的方法，获取错误消息“未定义'节点'.....”，所以我没有其他选项而不是在这里发布，如果任何人能够帮助我在这将是欣赏，我在jquery kendo网格上使用了列模板，谢谢

方案

点击指定行中的该按钮，它应该带有“ ID （如下所示）”并重定向到“ ActionResult ”控制器，我可以根据需要进一步编码我的要求

代码（部分代码）

columns: [
                { field: "ID", Title: "ID", filterable: false, sortable: false, hidden: true },

                { field: "RowID", Title: "RowID", filterable: false, sortable: false, hidden: true },

                { field: "BillNumber", Title: "BillNumber", filterable: false, sortable: false,hidden:true },

                { field: "ServiceName", Title: "ServiceName",width:600 },

                { field: "ServiceStatus", Title: "ServiceStatus", width: 150 }
// Creating template column

               , {
                   field: "Action", title: "Is Action", template: "<input type=\"checkbox\"    #= Action ? checked='checked' : '' #  class=\"check_row\"/> ", editable: false,

                  // field: "Action",title: "Preview ", template: '<input type="button" class="info" name="info" value="Info" style="height: 26px; margin: 0px 2px; min-width: 64px;" />',                       

    headerTemplate: '<label>  <input type="checkbox" id="checkAll"/>Print All</label>', filterable: false, sortable: false, width: 100,                     
               }

目前我能够在列中生成复选框，我需要的是一个带按钮的列（与每行中的复选框相同）

Manjuboyz

Answer 1

在单元格中定义按钮非常简单......基本上你做得对。

示例：将列定义为：

columns: [
    ...
    {
        title: "Preview ", 
        template: '<input type="button" class="k-button info" name="info" value="Info" />',                       
        headerTemplate: '<label>  <input type="checkbox" id="checkAll"/>Print All</label>', 
        filterable: false, 
        sortable: false, 
        width: 100                     
    }
]

将template定义为input类型的button。如果您希望它看起来像Kendo UI按钮，则为其添加k-button类。

然后，您可以绑定一个click处理程序：

$(".info").on("click", function() {
    var row = $(this).closest("tr");
    var item = grid.dataItem(row);
    ...
});

其中item包含与您单击按钮的行对应的所有数据。

在此处运行示例：http://jsfiddle.net/m8fsv/1/

编辑：如果您需要控制/决定展示其中一个，您应该将模板更改为：

<script id="template" type="text/kendo-template">
    # if (showButton) { #
    <input type="checkbox" #= data.Action ? checked="checked" : "" #  class=\"check_row\"/>
    # } else { #
    <input type="button" class="k-button info" name="info" value="Info" />
    # } #
</script>

您可以在此处查看：http://jsfiddle.net/OnaBai/m8fsv/12/

在kendo网格的列模板上添加按钮

1 个答案: