如何在webgrid标题点击上导航或调用ajax操作

本文关键字:导航 调用 ajax 操作 webgrid 标题 | 更新日期: 2023-09-27 18:19:37

我正在mvc应用程序中动态生成我的网络网格。我有一个要求,我需要导航到webgrid列标题上的不同页面。现在web网格列标题是超链接,它对网格中的记录进行排序。但我需要使用ajax调用转到另一个页面,点击任何一个帮助我的标题

这是我的动态生成网格。

@using System.Dynamic
@model List<System.Collections.IDictionary>
<link href="~/Content/grid.css" rel="stylesheet" />
@{
    var result = new List<dynamic>();
    foreach (var emprow in Model)
    {
        var row = (IDictionary<string, object>)new ExpandoObject();
        var eachEmpRow = (Dictionary<string, object>)emprow;
        foreach (KeyValuePair<string, object> keyValuePair in eachEmpRow)
        {
            row.Add(keyValuePair);
        }
        result.Add(row);
    }
    var grid = new WebGrid(result, rowsPerPage: 50);
}
@if (@Model != null)
{
    @grid.GetHtml(
                htmlAttributes: new { id = "grdHoteling" },
                tableStyle: "webgrid-table",
        headerStyle: "webgrid-header",
        footerStyle: "webgrid-footer",
        alternatingRowStyle: "webgrid-alternating-row",
        selectedRowStyle: "webgrid-selected-row",
        rowStyle: "webgrid-row-style",
        mode: WebGridPagerModes.All)
}

请帮忙吗?提前谢谢。

如何在webgrid标题点击上导航或调用ajax操作

沿着这些线的东西。还有一个属性将禁用排序,但您始终可以在单击事件上注册并取消默认行为。之后你可以决定去哪里。您还可以通过在click事件回调中使用this关键字来获取DOM元素。如果您想存储额外的data-或只是获取有关标头的其他信息,这将非常有用。

$(".webgrid-header").click(function(event){
       event.preventDefault();
       //navigate to your other site
});