2

我正在使用 Kendo UI Grid 显示邮件列表，当我单击一行时，我需要从客户端已经拥有的邮件对象中选择一行并在编辑器中显示邮件正文。但无法获取选中的行值。

这是查看代码：

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MVC3toHTML5.Models.MailModel>" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Index</title>
    <link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
     <link href="<%= Url.Content("/Content/web/kendo.common.min.css") %>" rel="stylesheet" type="text/css" />
    <link href="<%= Url.Content("/Content/web/kendo.rtl.min.css") %>" rel="stylesheet" type="text/css" />
    <link href="<%= Url.Content("/Content/web/kendo.default.min.css") %>" rel="stylesheet" type="text/css" />
    <link href="<%= Url.Content("/Content/shared/examples-offline.css") %>" rel="stylesheet" type="text/css" />
    <script src="<%: Url.Content("/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("/Scripts/modernizr-1.7.min.js") %>" type="text/javascript"></script>
      <script src="<%= Url.Content("/Scripts/jquery.min.js") %>"></script>
    <script src="<%= Url.Content("/Scripts/kendo.web.min.js") %>"></script>
    <script src="<%= Url.Content("/Scripts/kendo.aspnetmvc.min.js") %>"></script>
    <script src="<%= Url.Content("/Scripts/console.min.js") %>"></script>
    <script src="<%= Url.Content("/Scripts/prettify.min.js") %>"></script>
</head>
<body>
    <div style="font-size:medium;">
        <%: Html.Kendo().Grid(Model.mailList)
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.MailId).Width(200);
            columns.Bound(p => p.From.Value).Width(200);
            columns.Bound(p => p.Subject).Width(200);

        })
                        .Pageable()
                        .Sortable()
                        .Scrollable()
                        .Filterable()
                        .Groupable()
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .ServerOperation(false)
                                        .Events(events => events.Change("Grid_OnRowSelectUID"))

                         )
    .Selectable()
%>
    </div>
    <div style="margin-left:220px;">
  <% Html.Kendo().Editor()
      .Name("Editor")
      .HtmlAttributes(new { style = "width: 740px;height:440px;" })


      .Render();
%>
<script type="text/javascript">
    function Grid_OnRowSelectUID() {

        var dataSource = new kendo.data.DataSource({
            change: function (e) {
                alert("datasource");
            }
        });

        dataSource.bind("change", function (e) {
            alert("Bind");
        });

    }









</script>
    </div>
</body>
</html>

控制器如下：

namespace MVC3toHTML5.Controllers
{
    public class Home2Controller : Controller
    {
        public ActionResult Index()
        {
            MailModel mailModelobj = new MailModel();
            mailModelobj.GetMailList();
            return View(mailModelobj);

        }

    }
}

我从网络服务收到邮件。实现这一目标的正确方法是什么？

4

1 回答 1

2

使用Grid 的change事件而不是 dataSource 的 change 事件。

<%: Html.Kendo().Grid(Model.mailList)
    .Name("Grid")
    .Selectable()
    .Events(ev=>ev.Change("onSelectRow"))
   //...



   <script>
        function onSelectRow(e){
             var currentSelectedItem = this.dataItem(this.select());
             alert(currentSelectedItem.SomeProp);
             $('#Editor').data().kendoEditor.value(currentSelectedItem.SomeProp);
        }
   </script>
于 2012-12-21T23:00:25.653 回答