剑道电网隐藏/显示删除按钮 [英] Kendo Grid Hiding/Showing Delete button

问题描述

我是新的剑道MVC组件以及jQuery的。

I am new on Kendo MVC components as well as on jQuery.

我建立剑道Grid.I想隐藏的destroy（删除）在页面加载命令的剑道grid.After，当我点击同一页面上的按钮，它应该是可见的。

I am building Kendo Grid.I would like to hide destroy(delete) command on page load on Kendo grid.After that when I click to button on same page, it should be visible.

剑道格：

@(Html.Kendo().Grid<Model>() 
.Name("grid")
.Columns(columns =>
{
columns.Bound(product => product.DESCRIPTION).Title("Description");
columns.Bound(product => product.CODE).Title("Description");
columns.Command(commands =>
{
commands.Destroy().HtmlAttributes(new { id = "buttondelete" }); 
}).Title("Operations");
 })
.ToolBar(toolbar =>
{
toolbar.Create().Text("Add Records"); 
toolbar.Save(); 
})

.Editable(editable => editable.Mode(GridEditMode.InCell)) 
.Pageable(pager => pager
.PageSizes(true)
.Input(true)
.Refresh(true)
)
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(true)
.Events(events => events.Error("onError"))
.Model(model =>
{
 model.Id(product => product.ID); // Specify the property which is the unique identifier of the model
model.Field(p => p.DESCRIPTION).Editable(false);
model.Field(product => product.CODE).Editable(false);
})
.Create(create => create.Action("a", "www")) 
.Read(read => read.Action("b", "www"))  
.Update(update => update.Action("c", "www"))  
.Destroy(destroy => destroy.Action("d", "www")) 
    )
 )

记者：

$(document).ready(function () {

  //$("#grid").find(".k-grid-delete").hide()//hide delete button
    $("#grid").find(".k-toolbar").hide(); //hide toolbar
    $(".k-grid-delete", "#grid").hide();
 });





$('#EnableEdit').click(function () {
    $("#grid").find(".k-toolbar").show();

   // $(".k-grid-delete", "#grid").show();
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.at(0).fields["CODE"].editable = true;
    grid.dataSource.at(0).fields["DESCRIPTION"].editable = true;

});

编辑：根据第一answer.Now改变了一些地方
$（K-网删除，#grid），隐藏（）。无法掩盖k.grid-删除类。我想剑道电网之前创建的JavaScript被加载。当我用它编辑按钮的点击功能在它里面隐藏删除按钮。

changed some parts according to first answer.Now $(".k-grid-delete", "#grid").hide(); cannot hide k.grid-delete class. I guess JavaScript is loaded before kendo grid created. When I use it inside click function of edit button it hides delete buttons.

推荐答案

如果您使用相同的 ID 为每列你有相同的许多元素 ID 这是不是的法律的。尝试使用标识CSS类属性的删除按钮，在创建（页面加载）隐藏它，然后单击显示它。

If you use the same id for each columns you have many elements with the same id which is not legal. Try using the CSS class attribute that identifies a delete button and on creation (page load) hide it and then on click show it.

code隐藏它们。

$(".k-grid-delete", "#grid").hide();

code为显示他们回来

Code for showing them back

$('#EnableEdit').click(function () {
    $(".k-grid-delete", "#grid").show();
});

这里

的jsfiddle例如： http://jsfiddle.net/OnaBai/pSgeD/

这篇关于剑道电网隐藏/显示删除按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！