Jak dodać przycisk niestandardowy w każdym rzędzie w Kendo Grid

Question

Próbuję dodać przycisk niestandardowy do każdego wiersza siatki Kendo, ale nie otrzymuję pożądanego sygnału wyjściowego.Tak więc moim wymaganiem jest dodanie dynamicznych przycisków do każdego wiersza i do klikając na ten przycisk muszę przetworzyć kilka rzeczy, dla których potrzebuję kilka wartości kolumn, które mają zostać przekazane do tego kliknięcia przycisku.

Próbowałem coś

@(Html.Kendo().Grid(Model)  
.Name("Grid") 
.Columns(columns => 
{ 
columns.Bound(o => o.Id); 

    columns.Bound(o => o.TBRId).Width(100).Title(UI_Resources.ListLabel_TBRId); 

    columns.Bound(o => o.THUQuantity).Width(50).Title(UI_Resources.ListLabel_THUQuantity).HtmlAttributes(new { style = "text-align:right" }); 
    columns.Bound(o => o.Id).ClientTemplate("<input width='50px' type='button' value= " + UI_Resources.Button_Details + " onclick='onDetailUnitClick(#= Id #);' class='btn btnTable' />").Width(50).Title(""); 
columns.Bound(o => o.IsPOD).ClientTemplate("#= AppendZeroPODButton(Id,IsPOD) #").Width(60).Title(""); 

}) 

.Pageable() 

.Sortable() 

.Scrollable() 

.Filterable() 

.DataSource(dataSource => dataSource 

    .Ajax() 

      .Read(read => read.Action("GetUnitsForShipment", "POD",new { shipmentId = @Model, Mode = "POD" })) 

     ) 

) 

/*JavaScript */ 

function onDetailUnitClick(Id) { 
var podDateTime = $("#enteredPODDateTime").val(); 
var stopId = $("#hiddenStopId").val(); 
var mode = ''; 
if (typeof $("#hiddenMode").val() != 'undefined') 
    mode = $("#hiddenMode").val(); 
window.location.href = "/POD/Details/" + Id + "?stopId=" + stopId + "&date=" + podDateTime + "&mode=" + mode; 
    }; 

    function AppendZeroPODButton(Id, isPOD) { 
if (isPOD == true) { 
    return "<input width='100px' type='button' value= 'Zero POD' onclick='onPODUnitClick(" + Id + ",1);' class='btn btnTable btn-success' disabled />"; 
} 
else { 

    return "<input width='100px' type='button' value= 'Zero POD' onclick='onPODUnitClick(" + Id + ",1);' class='btn btnTable btn-danger' />"; 
}} 

można zasugerować mi, co robię źle !! Pracował dla sieci Telerek MVC.

Dzięki Yogendra Singh

Answer 1

Udało jeśli zmienię ClientTemplate do

columns.Template(t => t.IsPOD).HeaderTemplate("").ClientTemplate(@"<a href='javascript: void(0)' class='btn btnTable' onclick='onDetailUnitClick(#= Id #)' title='button delete'>" + UI_Resources.Button_Details + " </a>").Title("").Width(50); 

I

columns.Bound(p => p.IsPOD).ClientTemplate("# if(IsPOD == true) { # <a href='javascript: void(0)' class='btn btnTable btn-success' onclick='onPODUnitClick(#= Id #, 1)' title='Zero POD'>" + UI_Resources.Button_ZeroPOD + "</a> # } else {# <a href='javascript: void(0)' class='btn btnTable btn-danger' onclick='onPODUnitClick(#= Id #, 1)' title='Zero POD'>" + UI_Resources.Button_ZeroPOD + "</a> # } #").Title("").Width(100); 

Answer 2

Możesz dodać przycisk Custom jako well.Refer to http://demos.kendoui.com/web/grid/custom-command.html