CODEWITHSUNDEEP
javascriptjquerycomboboxjquery-ui-autocomplete
Kanishka Panamaldeniya
Kanishka Panamaldeniya

Reputation: 17576

jquery ui autocomplete comobox recreating options not working

hi i am using jquery ui autocomplete combobox plugin , i am creating a combobox initially in document.ready

jQuery('#combolist_city').combobox();

i set some options when page is loading 

<select id="combolist_city" class="city" name="search[city]">
                            <option value="0">Select city</option>
                            <?php 
                                if(isset($city_list))
                                {
                                    foreach($city_list as $city_data)
                                    {
                                        if(isset($selected_city) && ($selected_city == $city_data['CityID']))
                                        {
                                            echo "<option selected='selecetd' value=".$city_data['CityID'].">".$city_data['CityName']."</option>";
                                        }
                                        else 
                                        {
                                            echo "<option value=".$city_data['CityID'].">".$city_data['CityName']."</option>";  
                                        }
                                    }   
                                }
                            ?>                      
                        </select>

now i want to change his options, i am tying to do it by

jQuery("#combolist_city").combobox({
                                    initialValues: ['aaa','bbb','ccc']
                                });

but it is not working , it is not recreating the options ,

how can i do this , please help.............................

Upvotes: 0

Views: 157

Answers (1)

scessor
scessor

Reputation: 16115

You have to do it manually. First destroy the combobox and empty the select. Append the new options and build the combobox again:

var aList = {'id1': 'val1', 'id2': 'val2', 'id3': 'val3'};
var sKey;
$("#combolist_city").combobox('destroy').empty();
for (sKey in aList) {
    $("#combolist_city").append('<option value="' + sKey + '">' + aList[sKey] + '</option>');
}
$("#combolist_city").combobox();

Also see this example.

Upvotes: 1

Related Questions