修改

Question

我有一个剑道网格，附近有一个图像，就像一个按钮。按下时，它将调用控制器方法。我想将选定的行数据发送到该方法。

查看

<a href="#" id="ic_open" class="tooltip2" title="Abrir">
    <span title="">
        <img class="toolbar-icons" src="../../Images/open.png"/>
    </span>
</a>
...
<div id="datagrid">
    @(Html.Kendo().Grid(Model)
        .Name("datagrid_Concessoes")
        .Columns(columns =>
        {
            columns.Bound(c => c.Id).Width(70);
            columns.Bound(c => c.Code);
            columns.Bound(c => c.Description);
            columns.Bound(c => c.CreationDate);
            columns.Bound(c => c.CreationUser);
        })
        .HtmlAttributes(new { style = "height: 534px;" })
        .Scrollable()
        .Sortable()
        .Selectable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .ButtonCount(5))
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(15)
            .Read(read => read.Action("GetConcessoes", "MasterData"))
        )
    )
</div>

脚本：

<script type="text/javascript">

    $(function () {

        $('.tooltip2').click(function () {

            var id = this.id;

            $.get('@Url.Content("GetPartialView")',
            { "id": id },
            function (data) {
                $('#div-for-partial').html(data);
            });

        });
    });

</script>

此脚本成功将链接的ID（ ic_open ）发送到控制器。我想通过相同的函数或其他（无关紧要的）将所选行数据发送到控制器，以便我可以操作该信息。

修改

控制器方法

public ActionResult GetPartialView(string id)
{
    switch (id)
    {
        case "":
            return PartialView("_Concessoes");
        case "tab1":
            return PartialView("_Concessoes");
        case "tab2":
            return PartialView("_AutoEstradas");
        case "ic_open":
            return PartialView("_NovaConcessao");

    }

    return RedirectToAction("Index");

}

Answer 1

我正在使用KendoJS，但我相信这也适用于你自己：

var grid = $("yourgrid's id or class");
var selectedRow;
grid.change = function()
{
   grid.select().each(function () {
         var dataItem = grid.dataItem($(this));
          selectedRow = dataItem;
   });
}

我还发现了剑道ASP.NET MVC的this：

@(Html.Kendo().Grid(Model)
      .Name("grid")
      .Events(e => e
          .DataBound(@<text>
              function() {
                  //Handle the dataBound event inline
              }
          </text>)
          .Change(@<text>
              var selectedRow;
              function() {
                       var grid = this;
                        grid.select().each(function () {
                        var dataItem = grid.dataItem($(this));
                        selectedRow = dataItem;                          
                    });
              }
          </text>)
      )
)

获得所选行后，其余部分很容易。只需将您想要的值发送到cshtml页面上的隐藏值元素中，或者直接在JavaScript代码上调用控制器的ajax方法。

Answer 2

您的脚本应如下所示：

<script type="text/javascript">

    $(function () {

        $('.tooltip2').click(function () {

            var id = this.id;

            var concessoesGrid = $("#datagrid_Concessoes").data("kendoGrid");
            var row = concessoesGrid.select();    

            $.get('@Url.Content("GetPartialView")',
            { "id": id, "modelData":row },
            function (data) {
                $('#div-for-partial').html(data);
            });

        });
    });

</script>

现在控制器端也会发生变化：

   public ActionResult GetPartialView(string id, ModelClass modelData)
    {

       //here you can access the modelData Object which will have the value of Selcted row of Grid
        switch (id)
        {
            case "":
                return PartialView("_Concessoes");
            case "tab1":
                return PartialView("_Concessoes");
            case "tab2":
                return PartialView("_AutoEstradas");
            case "ic_open":
                return PartialView("_NovaConcessao");

        }

        return RedirectToAction("Index");

    }

注意：如果要将多个选定的网格记录传递给控制器，则需要更改控制器参数以接受对象列表。

如何将选定的Kendo网格数据行传递给控制器

修改

2 个答案: