Question

我有一个网格和下拉列表。 dropdownlist的项目应更改，具体取决于我在网格中选择的行。一切正常。但是问题是当我选择另一行时，它显示的是前一行的数据。刷新不正常。

例如：

我对于站点1（利奥，克里斯，帕勃罗）和站点2（马克，史蒂夫，比尔）有两个电子邮件列表。

当我在网格（利奥，克里斯，帕勃罗）中选择站点1时，它会加载到下拉列表中。当我选择站点2时，它正在加载（标记，史蒂夫，比尔），但显示（利奥），这是不正确的。

function filterSiteDemoEmail(e) {
        var grid = $('#gridSiteDemo').data('kendoGrid');
        var currentDataItem = grid.dataItem(grid.select());
        return {
            ip_cmcode: currentDataItem.customerCode,
            ip_siteno: currentDataItem.siteNumber
        }
    }

function onGridSiteDemoRowSelection(e) {

        var grid = e.sender;
        var currentDataItem = grid.dataItem(this.select());
        if (currentDataItem != null) {
            $('#siteDemoEmailDropDownList').data('kendoDropDownList').dataSource.read();   
        }
    }

<div class="row">
                    <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
                        @(Html.Kendo().Grid<ServicePROWeb.Controllers.GridController.SiteDemo>()
                            .Name("gridSiteDemo")
                            .Columns(columns =>
                            {
                                columns.Bound(p => p.customerCode).Title("Customer");
                                columns.Bound(p => p.siteNumber).Title("Site");
                            })
                            .Selectable()                            
                            .DataSource(dataSource => dataSource
                            .Ajax()                            
                            .Read(read => read.Action("LoadCustomerSiteDemo", "Grid")))
                            .Events(events => events.Change("onGridSiteDemoRowSelection"))
                        )
                    </div>
                    <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
                        @(Html.Kendo().DropDownList()
                            .Name("siteDemoEmailDropDownList")
                            .DataTextField("email")
                            .DataValueField("email")
                            .DataSource(source =>
                            {
                                source.Read(read =>
                                {
                                    read.Action("GetSiteDemoEmail", "Grid").Data("filterSiteDemoEmail"); //Set the Action and Controller name
                                })
                                .ServerFiltering(true); //If true the DataSource will not filter the data on the client.
                            })
                            .AutoBind(false)
                            .SelectedIndex(0)
                            .HtmlAttributes(new { @style = "width: 100%" })
                        )
                    </div>
                </div>

public class SiteDemo
    {
        public decimal customerCode { get; set; }
        public int siteNumber { get; set; }
    }

    public class SiteDemoEmail
    {
        public string email { get; set; }

    }

    public ActionResult LoadCustomerSiteDemo([DataSourceRequest]DataSourceRequest request)
    {
        List<SiteDemo> siteDemoList = new List<SiteDemo>();

        SiteDemo sd = new SiteDemo();
        sd.customerCode = 1;
        sd.siteNumber = 1;
        siteDemoList.Add(sd);

        sd = new SiteDemo();
        sd.customerCode = 1;
        sd.siteNumber = 2;
        siteDemoList.Add(sd);

        var jsonResult = Json(siteDemoList.ToDataSourceResult(request));
        jsonResult.MaxJsonLength = int.MaxValue;
        jsonResult.JsonRequestBehavior = JsonRequestBehavior.AllowGet;

        return jsonResult;
    }

    public JsonResult GetSiteDemoEmail(decimal ip_cmcode, int ip_siteno)
    {
        CustomerRepository cr = new CustomerRepository();

        List<SiteDemoEmail> SiteDemoEmailList = new List<SiteDemoEmail>();

        if (ip_siteno == 1)
        {
            SiteDemoEmail sde = new SiteDemoEmail();
            sde.email = "leo@gmail.com";
            SiteDemoEmailList.Add(sde);

            sde = new SiteDemoEmail();
            sde.email = "chris@gmail.com";
            SiteDemoEmailList.Add(sde);

            sde = new SiteDemoEmail();
            sde.email = "pablo@gmail.com";
            SiteDemoEmailList.Add(sde);
        }
        else
        {
            SiteDemoEmail sde = new SiteDemoEmail();
            sde.email = "mark@gmail.com";
            SiteDemoEmailList.Add(sde);

            sde = new SiteDemoEmail();
            sde.email = "steve@gmail.com";
            SiteDemoEmailList.Add(sde);

            sde = new SiteDemoEmail();
            sde.email = "bill@gmail.com";
            SiteDemoEmailList.Add(sde);
        }

        return Json(SiteDemoEmailList, JsonRequestBehavior.AllowGet);
    }

Answer 1

在onGridSiteDemoRowSelection处理程序中替换此行：

$('#siteDemoEmailDropDownList').data('kendoDropDownList').dataSource.read();

使用

var ddl = $('#siteDemoEmailDropDownList').data('kendoDropDownList');
ddl.dataSource.read()
ddl.select(0);

似乎可以解决问题。

Answer 2

这应该在不选择第一个元素的情况下完成您的工作。只需将ajax调用设置为Post即可，以防止在kendo dropdownlinst中默认使用ajax缓存

.DataSource(source =>
 {
           source.Read(read =>
                   {
                           read.Action("ActionMethod", "Controller").Type(HttpVerbs.Post);
                    });
})

有关更多信息，请检查以下内容：https://www.telerik.com/forums/prevent-ajax-caching-on-read

Kendo DropDownList无法正确刷新

2 个答案: