javascript - 如何调用 MVC telerik 网格刷新按钮的 onclick 事件

Question

我想在 telerik 网格的刷新按钮的点击事件上做一些功能。

默认情况下，刷新按钮位于左下角网格的底部。我只想知道如何调用它的点击事件。

这是我在 index.cshtml 上的代码:

@(Html.Telerik().Grid<ModuleViewModel>()
        .Name("Grid")
         .DataKeys(keys =>
        {
            keys.Add(p => p.Modules.Id);
        })
        .DataBinding(dataBinding =>
                dataBinding.Ajax()
                .Select("Select", "Module", new { GridButtonType.Text })                    
                .Update("Save", "Module", new { GridButtonType.Text }))
        .Columns(columns =>
        {
            columns.Command(commands =>
            {
                commands.Custom("Edit").Action("Edit", "Module").ImageHtmlAttributes(new { @class = "t-edit" }).ButtonType(GridButtonType.Image).HtmlAttributes(new { title = "Edit" });
            }).Width(20).Title("Edit").Visible(OperationHelper.EditOperation);
            columns.Command(commands =>
            {
                commands.Custom("Delete").Action("Delete", "Module").ImageHtmlAttributes(new { @onclick = "return confirmDelete()", @class = "t-delete" }).ButtonType(GridButtonType.Image).HtmlAttributes(new { title = "Delete", @class = "RightAlign" });
            }).Width(20).Title("Delete").Visible(OperationHelper.DeleteOperation);
            columns.Bound(p => p.Modules.Name).Width(100).Title("Name");
            columns.Bound(p => p.Modules.SubModuleId).Width(100).Title("SubModule Id").Hidden();
            columns.Bound(p => p.SubModuleName).Width(100).Title("SubModule Name");
            columns.Bound(p => p.Modules.IsDisplay).Width(100).Title("Is Display");
        })
        .Sortable()
        .Filterable()

)

Answer 1

不确定是否有刷新的客户端事件。在 Kendo Grid 上，刷新按钮实现为 HTML anchor 标记，如下所示:

<a class="k-pager-refresh k-link" href="/controller/action?etc..." title="Refresh">
<span class="k-icon k-i-refresh">Refresh</span>
</a>

因此，要在刷新中添加额外的功能，您可以将一些 Jquery 挂接到 anchor onclick 并执行您的操作以及/而不是默认行为。

根据您的评论 - 您当然可以这样做......

$(document).ready(function () {
    $('.k-pager-refresh').click(function () {
        alert('I was clicked ' + $(this).attr("href")); 
        var link = $(this).attr("href");
        if (link == "/SalesDb/Batch") {
            alert("Refreshing");
        }
    });
});

并且 telerik 默认刷新脚本也将运行(除非您从点击方法返回 false)。

如果您只想定位那个按钮，那么请使用特定的 jquery 选择器 - 例如将您的网格包裹在 <div> 中并选择 <div> 中的刷新 anchor

您的网格的 ID 为“Grid”，因此您的选择器类似于:

$('#Grid .t-refresh').click(function () { ...