kendo UI中的客户端详细信息模板无法正常工作

时间:2013-05-02 21:22:05

标签: asp.net-mvc kendo-ui kendo-grid kendo-asp.net-mvc

我在asp .net MVC应用程序中有一个kendo网格。我跟随kendoui网站上的演示,在我的网格上构建一个详细模板。我无法让它发挥作用。这是我的代码。

@(Html.Kendo().Grid<KendoUIMvcApplication2.Models.GetCallDetailResult>()
.Name("Grid")
.Columns(columns =>
    {
        columns.Bound(p => p.contactCommunicationCallID).Title("CCCID").Width("20");
        columns.Bound(p => p.LocalStartDateTime).Title("Date Time").Format("{0:M/d/yyyy}");
        columns.Bound(p => p.LPEmployeeCode).Title("Employee Code").Width("50");
        columns.Bound(p => p.AdSource).Title("Ad Source");
        columns.Bound(p => p.Status);
        columns.Bound(p => p.Duration).Title("Duration");
        columns.Bound(p => p.TrackingPhoneNumber).Title("Tracking Number");
        columns.Bound(p => p.CallerNumber).Title("Caller Number");
        columns.Bound(p => p.RegionName).Title("Region Name");
        columns.Bound(p => p.DistrictName).Title("District Name");
        columns.Bound(p => p.CampaignName).Title("Campaign Name");
        columns.Bound(p => p.AdSourceCategoryName).Title("Ad Source Category");

    })
.Pageable(page => page.Enabled(true).PageSizes(new Int32[] { 5, 10, 20, 40 }))
.Sortable()
.HtmlAttributes(new { style = "height: 700px" })
.Scrollable()
.ClientDetailTemplateId("template")
.DataSource(datasource => datasource
    .Ajax()
    .PageSize(5)
    .Read(read => read.Action("CallDetail", "Home"))
)
.Events(ev => ev.DataBound("dataBound"))

<script>
function dataBound() {
    this.expandRow(this.tbody.find("tr.k-master-row").first());
}
</script>

<script id="template" type="text/kendo-tmpl">
  @(Html.Kendo().TabStrip()
        .Name("tabStrip_#=contactCommunicationCallID#")
        .SelectedIndex(0)
        .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
        .Items(items =>
        {
            items.Add().Text("Details").Content(@<text>
                @(Html.Kendo().Grid<KendoUIMvcApplication2.Models.GetCallDetailResult>()
                    .Name("grid_#=contactCommunicationCallID#")
                    .Columns(columns =>
                    {
                        columns.Bound(p => p.contactCommunicationCallID).Title("ID").Width(56);
                        columns.Bound(p => p.SiteName).Width(110);
                        columns.Bound(p => p.LPFirstName);
                        columns.Bound(p => p.LPLastName).Width(190);
                    })
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(5)
                        .Read(read => read.Action("ReportList", "Home", new { CCCID = "#=contactCommunicationCallID#" }))
                    )
                    .Pageable()
                    .Sortable()
                    .ToClientTemplate()
                 )
            </text>                        
            );
            items.Add().Text("Contact Information").Content(
                "<div class='employee-details'>" +
                    "<ul>" +
                        "<li><label>Country:</label>#= contactCommunicationCallID #</li>" +
                        "<li><label>City:</label>#= SiteName #</li>" +
                        "<li><label>Address:</label>#= LPFirstName #</li>" +
                        "<li><label>Home Phone:</label>#= LPLastName #</li>" +
                    "</ul>" +
                "</div>"
            );                
        })
        .ToClientTemplate())
</script>

<script>
function dataBound() {
    this.expandRow(this.tbody.find("tr.k-master-row").first());
}
</script>

控制器操作方法:

    public ActionResult CallDetail([DataSourceRequest] DataSourceRequest request)
    {
        var readcalldetails = new DataDataContext().GetCallDetail(1, 762, 1).ToList();
        var result = readcalldetails.ToDataSourceResult(request);
        return Json(result); 
    }

    public ActionResult ReportList(int CCCID, [DataSourceRequest] DataSourceRequest request)
    {
        var readreportlist = new DataDataContext().GetCallDetail(1, 762, 1).ToList().Where(cd => cd.contactCommunicationCallID == CCCID);
        var result = readreportlist.ToDataSourceResult(request);
        return Json(result);
            //.Where(cd => cd.ContactCommunicationCallID == CCCID)
    }

1 个答案:

答案 0 :(得分:0)

实际上,我通过反复试验发现,您需要从web.config中删除的唯一内容是来自httpRuntime的targetFramework="xx"部分 - 您可以保留encoderType部分!