Cascading Dropdown Racing,MVC Jquery

时间:2017-04-23 11:43:43

标签: jquery ajax asp.net-mvc drop-down-menu

我正在使用MVC.Net项目,该页面有一个页面,此页面有两个级联下拉列表(Dropdown A,Dropdown B),主要是Dropdown A.我在Dropdown A中使用Jquery Ajax手动实现了级联更改事件,除了这种情况他们工作正常: -

假设Dropdown A有两个值(Val A,Val B),当选择Val B Ajax Request时,会在服务器端执行更多业务逻辑(花费更多时间)比Val A的案例。

问题是当我选择Val B并且不等待Dropdown B填充ajax结果并且我选择Val A Directly时,Dropdown B会填充Val的Ajax结果第一个(花费时间)然后是Val B Ajax结果(在业务逻辑完成之后(花更多时间))

问题我想保证最后一个选定值的Ajax结果将始终赢得而不禁用下拉列表A直到Ajax结果到来。

2 个答案:

答案 0 :(得分:0)

我刚刚意识到我的逻辑完全被破解而没有理解潜在的问题 - 返回数据的顺序是完全随机的。根据自由取消现有的AJAX请求似乎是一个很有前景的解决方案,但我不知道该怎么做。

您的案例的丑陋但100%工作方式是返回数据以及您的请求参数(例如选择的值),以便仅当响应的请求参数与您的最新请求参数匹配时才执行绑定选定的价值。

var selectedValue;

$('#ddlA').on('change', function() {
    selectedValue = $(this).val();

    $.ajax({
       method: 'GET'
       url   : ** AJAX url **,
       data  : { key: selectedValue }
    })
    .done(function(result) {
        if (** result's key ** === selectedValue) {
           // bind #ddlB
       }
    });
});

在不取消客户端/服务器进程的情况下,这可能是最简单但最天真的方式。

答案 1 :(得分:0)

重构优化业务逻辑的代码,需要花费很长时间才能不花时间而代之以诀窍走得很艰难。因为取消ajax请求会触发ajax错误处理程序,这对于这种情况是不可接受的。而且没有任何有用的答案。