Jquery 在MVC3 Webgird中展开和折叠

有人能帮我实现扩展/折叠功能吗

单击展开按钮时，我需要获取相应记录的相关数据，并将其显示为子行

grid.Column(header: "Expand", 
    format: @<text>
        <a href='#' class="expandable-open-button" rel="1" >&gt;</a> 
        <div class="expandable-child-row"></div> 
     </text>)

grid.Column（标题：“展开”，
格式：@
)

我正在考虑使用jQuery。单击“扩展”链接，我们可以从数据库获取数据，并将webgrid html设置为元素。

使用JQuery选择“子”元素（实际上是同级元素）；并展开元素：

// add the click handler
$(".expandable-open-button").on("click", function(e) {

    // prevent the default action on the link
    e.preventDefault();

    // select the details row and toggle its visibility
    $(this).next(".expandable-child-row").slideToggle();
});

编辑您可以通过将项目ID作为数据属性添加到标记中来传递项目ID

format: (item) => @<text><a data-id='@item.ID'>

使用JQuery选择“子”元素（实际上是同级元素）；并展开元素：

// add the click handler
$(".expandable-open-button").on("click", function(e) {

    // prevent the default action on the link
    e.preventDefault();

    // select the details row and toggle its visibility
    $(this).next(".expandable-child-row").slideToggle();
});

编辑您可以通过将项目ID作为数据属性添加到标记中来传递项目ID

format: (item) => @<text><a data-id='@item.ID'>

---

您能告诉我如何将项目id传递给此服务器吗function@Naresh最好的方法可能是将其作为属性添加到元素中。您能告诉我如何将项目id传递给此元素吗function@Naresh最好的方法可能是将其作为属性添加到元素中。