JQuery Cascade 插件下拉列表不刷新

我正在使用基于 JQuery 的级联插件 https://web.archive.org/web/20111206072619/http://plugins.jquery.com:80/project/cascade;可能它有效，但我发现它有很多问题。

也许有人已经遇到过这个插件，也许可以提供帮助。

所以，我使用这个插件进行位置过滤

http://clip2net.com/clip/m12007/1246819525-clip-2kb.png http://clip2net.com/clip/m12007/1246819525-clip-2kb.png（破碎的图像）

这是我的CS代码：

public JsonResult getChildren(string val)
    {
        if (val.IsNotNull())
        {
            int lId = val.ToInt();
            Cookie.Location = val.ToInt();
            var forJSON = from h in Location.SubLocationsLoaded(val.ToInt())
                          select new { When = val, Id = h.Id, Name = h.Name, LocationName = h.LocationType.Name };
            return this.Json(forJSON.ToArray());
        }
        else
            return null;
    }

这是我的 JS 代码：

<script type="text/javascript">
function commonMatch(selectedValue) {
    $("#selectedLocation").val(selectedValue);
    return this.When == selectedValue;
};
function commonTemplate(item) {
    return "<option value='" + item.Id + "'>" + item.Name + "</option>";
};


$(document).ready(function() {
    $("#chained_child").cascade("#Countries", {
        ajax: {
            url: '/locations/getChildren'
        },
        template: commonTemplate,
        match: commonMatch
    }).bind("loaded.cascade", function(e, target) {
        $(this).prepend("<option value='empty' selected='true'>------[%Select] Län------</option>");
        $(this).find("option:first")[0].selected = true;
    });
    $("#chained_sub_child").cascade("#chained_child", {
        ajax: {
            url: '/locations/getChildren'
        },
        template: commonTemplate,
        match: commonMatch
    }).bind("loaded.cascade", function(e, target) {
        $(this).prepend("<option value='empty' selected='true'>------[%Select] Kommun------</option>");
        $(this).find("option:first")[0].selected = true;
    });
    $("#chained_sub_sub_child").cascade("#chained_sub_child", {
        ajax: {
            url: '/locations/getChildren'
        },
        template: commonTemplate,
        match: commonMatch
    }).bind("loaded.cascade", function(e, target) {
        $(this).prepend("<option value='empty' selected='true'>------[%Select] Stad------</option>");
        $(this).find("option:first")[0].selected = true;

    });

});

我向 jquery.cascade.ext.js 添加了一个条件

if (opt.getParentValue(parent) != "empty")
            $.ajax(_ajax);

To prevent Ajax request without selected value, but I faced with problem, when I reset selection in first box 3d box and below does not refresh:

第二期： 我想知道在哪里注入我自己的函数的最佳位置，该函数可以做一些事情，有一个要求 - 我需要知道所有盒子都完成了工作。

原始插件代码的问题是它在操作下拉列表后不会触发更改事件。

另外，我喜欢从“依赖”而不是“级联”的角度来思考这个问题。我尝试创建一个简单的插件和一个演示页面，以显示整个事情是如何工作的。

Demo: http://jsbin.com/unope http://jsbin.com/unope

Code: http://jsbin.com/unope/edit http://jsbin.com/unope/edit

让我解释一下我做了什么。我创建了名为“dependent”的插件，它可以让您关联下拉列表的依赖关系。

e.g.

$('#dropDown2').dependent({ 
                            dependency : 'dropDown1',
                            values : getValues
                        });

上面的代码表明 dropDown2 依赖于 dropDown1，因此每当 dropDown1 值发生变化时，它都会调用您的 getValues 函数（将其传递给 dropDown1）。您应该从 getValues 函数返回相关值，它会将它们填充到 dropDown2 中。

请记住，这段代码不是通用的，我很快就编写了它来演示这个概念。您必须进一步调整它才能达到您想要的结果。

如果您有任何疑问，请告诉我。