CODEWITHSUNDEEP
javascriptasp.net-mvckendo-gridkendo-asp.net-mvc
Ibrahim Shaikh
Ibrahim Shaikh

Reputation: 398

button click event inside kendo grid never execute

I have a kendo-gridin asp.net mvc. Inside this template, I'm using a button click event, but the event is not firing at all. I don't know what went wrong.

Below is my code. Can anyone help?

.Columns(columns =>
{
    columns.Bound(c => c.currTypeName).Title("Type").Width(100).ClientTemplate("#=currTypeIcon#").HtmlAttributes(new { @class = "el_currTypeNameTooltip" });
    columns.Bound(c => c.regDate).Title("Registered").Width(200).Format("{0:MM/dd/yyyy}");
    columns.Bound(c => c.currName).Title("Curriculum Name").HtmlAttributes(new { @class = "el_CurrNameTooltip" }).ClientTemplate("<a href='\\#' class='JSfnMoreDetails'>#=currName#</a>");
    columns.Bound(c => c.dueDate).Title("Event/Due Date").Width(200).HtmlAttributes(new { @class = "el_DownloadInviteTooltip" }).ClientTemplate("<a href='\\#' class='JSfnDownloadInvite'></a>");
    columns.Bound(c => c.Status).Title("Status").Width(200);
    columns.Command(command =>
    {
        command.Custom("NextAction").HtmlAttributes(new { @class = "el_NextActionTooltip el_RemoveBorder el_NextActionsIcon" }).Click("NextActionRedirection");
        command.Custom("Trash").HtmlAttributes(new { @class = "el_TrashTooltip el_RemoveBorder el_NextActionsIcon" }).Click("TrashRedirection").Visible("fnTrashVisible");
        command.Custom("Note").HtmlAttributes(new { @class = "el_NotesTooltip el_RemoveBorder el_NextActionsIcon" }).Click("NoteRedirection").Visible("fnNoteVisible");
        command.Custom("ExemptionCheck").HtmlAttributes(new { @class = "el_ExemptionCheckTooltip el_RemoveBorder el_NextActionsIcon" }).Visible("fnExemptionCheckVisible").Click("ExemptionCheckRedirection");
    }).Title("Actions").Width(180).HeaderHtmlAttributes(new { @class = "el_Center" });
})

Javascript Functions

function NextActionRedirection(e) {
    debugger;
}

function TrashRedirection(dataitems) {
    debugger;
}

function NoteRedirection(e) {
    debugger;    
}

function ExemptionCheckRedirection(e) {
    debugger;    
}

none of the above function is executing when I click on the button inside my kendo grid, and when I see the code in the console, the button looks like below

<a role="button" class="k-button-icontext k-grid-NextAction el_NextActionTooltip el_RemoveBorder el_NextActionsIcon el_nextActionClick" href="#" title="Prerequisite Required11111"><i class="fal fa-arrow-square-right"></i></a>

which means button click event did not assign to buttons inside the grid

what is preventing the button click event here, and how can I solve this?

Upvotes: 0

Views: 1028

Answers (1)

Marissa Fernandes
Marissa Fernandes

Reputation: 781

If you inspect the demo for custom commands, that too just displays the view details command button without an onclick event like so-

<a role="button" class="k-button k-button-icontext k-grid-ViewDetails" href="#">ViewDetails</a>

I suggest you check that the javascript, where you have defined the click events is accessible to the grid. As your code looks fine, it may be a script issue.

Upvotes: 2

Related Questions