Reputation: 1918
i write this code for create Grid with kendo Ui in asp.net mvc
@(Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.Id).Groupable(false).Visible(false);
columns.Bound(p => p.BrandName);
columns.Bound(p => p.BrandAbbr);
columns.Bound(p => p.SrcImage);
columns.Command(command => command.Custom("ViewDetails").Click("showDetails"));
})
.ToolBar(toolbar =>
{
toolbar.Custom().Action("Create","Users").Text("add");
}
)
.Groupable()
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new {style = "height:500px;"})
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Multiple)
.Type(GridSelectionType.Row))
.DataSource(dataSource => dataSource
.Server()
.Model(model => model.Id(item => item.Id))
))
i want when user click on ViewDetails
alert BrandId
value Column, please help me.thanks all
Upvotes: 9
Views: 23273
Reputation: 3914
also I used this successfully :
<script type="text/javascript">
function showDetails(e)
{
e.preventDefaults();
var grid = $("#Grid").data("kendoGrid");
var selectedItem = grid.dataItem(grid.select());
//you can get the value of any column after that
alert("Brand Id is : " + selectedItem.Id);
alert("Brand Name is: " + selectedItem.BrandName);
}
</script>
Upvotes: 5
Reputation: 11588
You just need to add javascript function.
<script type="text/javascript">
function showDetails(e) {
e.preventDefault();
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
alert(dataItem.Id); //considering Id = BrandId
}
</script>
Here is the demo of Kendo Grid Custom Command
Upvotes: 15