forum

Home / DeveloperSection / Forums / How to Refresh dropdownlist but keep old selected value JSON

Ask Question

How to Refresh dropdownlist but keep old selected value JSON

Anonymous User 1647 16-Jan-2015

I have some javascript code in one of my CSHTML files

$.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();

basically the data is a list of selectlistitems, the first part looks for all of the supplier-languages div and selects the select, we then remove all of the listitems inside of the dropdownlist which has a value (so the "Please select..." default listitem I have, will not be removed as it has no value assigned), once all the populated items have been removed, I then iterate over my data variable and populate all of my dropdownlists again.

This code works fine, but the problem I am having is, the user goes to the page and selects some options, the user then adds a new option to the dropdownlist via a new opened jquery modal, when the modal is closed the code above is than ran, but not the options they had selected are now set back to please selecte. How can I keep the old values selected and place them back into my dropdownlist options?

asp.net c#  jquery  javascript  json 
Updated on 16-Jan-2015
Anonymous User

Anonymous User

Follow
I am a content writter !

Can you answer this question?

Answer

1 Answers

Anonymous User

Anonymous User

16-Jan-2015

Here is the working code

<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>

Basically now, it does the same as above, but it does it for each dropdownlist 1 at a time, instead of iterating over all of them, we get the selectedValue, we then remove all the children, we then populate each dropdownlist with the new options and also check to see if the saved selectedvalue is equal to any of the options we are about to populate the dropdownlist with, if this is true we then set that selected to be selected,

Hope this helps other people out. 

Liked By