刷新下拉列表但保留旧的选定值JSON

时间:2014-07-04 12:08:36

标签: c# javascript jquery asp.net json

我的一个CSHTML文件中有一些javascript代码

$.getJSON("@Url.Action("GetLanguages")", function (data) {
        debugger;
        var $languages = $('.supplier-languages select');
        $languages.children().filter(function () {
            return $(this).attr('value');
        }).remove();
        $.each(data, function () {
            debugger;
            var option = $('<option />', {
                text: this.Text,
                value: this.Value
            });

            $languages.append(option.clone());
        });
    });
    jSnap.modals.removeModal();

基本上数据是一个selectlistitems列表,第一部分查找所有供应商语言div并选择select,然后我们删除下拉列表中具有值的所有listitems(所以&#34 ;请选择...&#34;我有默认的listitem,因为它没有分配值,所以不会被删除),一旦删除了所有填充的项目,我就会迭代我的数据变量并再次填充所有的下拉列表

此代码工作正常,但我遇到的问题是,用户转到页面并选择一些选项,然后用户通过新打开的jquery模式向下拉列表添加新选项,当模态关闭时上面的代码是运行的,但是他们选择的选项现在没有选择,请选择。如何保留选中的旧值并将其放回我的下拉列表选项中?

2 个答案:

答案 0 :(得分:1)

这是工作代码

<script>
    $.getJSON("@Url.Action("GetLanguages")", function (data) {

        var $languages = $('.supplier-languages select');

        $languages.each(function () {
            var $language = $(this);
            var selectedValue = $language.val();

            $language.children().filter(function () {
                return $(this).attr('value');
            }).remove();


            $.each(data, function () {
                debugger;
                var option = $('<option />', {
                    text: this.Text,
                    value: this.Value,
                });

                if (this.Value == selectedValue) option.attr('selected', 'selected');

                $language.append(option.clone());
            });
        });
    });
    jSnap.modals.removeModal();
</script>

现在基本上,它与上面相同,但它一次为每个下拉列表1执行,而不是遍历所有下拉列表,我们得到selectedValue,然后删除所有子项,然后我们填充每个下拉列表使用新选项并检查保存的选定值是否等于我们将要填充下拉列表的任何选项,如果这是真的,我们然后将选定的选项设置为选中,

希望这有助于其他人。

答案 1 :(得分:0)

您可以在AJAX调用之前将旧的选定值保存在变量中:

var selectedValue = $('select').val();

当使用新值更新选择时,只需尝试将该值恢复。

$('select').val(selectedValue);