{"id":2861,"date":"2014-02-27T11:32:40","date_gmt":"2014-02-27T11:32:40","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2014\/02\/27\/jquery-selectize-js-changed-dropdown-identification-issue-collection-of-common-programming-errors\/"},"modified":"2014-02-27T11:32:40","modified_gmt":"2014-02-27T11:32:40","slug":"jquery-selectize-js-changed-dropdown-identification-issue-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2014\/02\/27\/jquery-selectize-js-changed-dropdown-identification-issue-collection-of-common-programming-errors\/","title":{"rendered":"jquery-selectize.js changed dropdown identification issue-Collection of common programming errors"},"content":{"rendered":"<p>I did it like that. It works but I hope this is a good way for doing this.<\/p>\n<pre><code>var xhr , a;\nvar country, $country;\nvar city,  $city;\n\n$country = $(\".select2-country\").selectize({\n                    render: {\n                        option: function(item, escape) {\n                            var markup = \"\";\n                            if (item.value !== undefined &amp;&amp; item.value != 0) {\n                                markup += '<img decoding=\"async\" width=\"25px\" src=\"http:\/\/www.geonames.org\/flags\/x\/'%20+%20item.value.toLowerCase()%20+%20'.gif\" \/> ';\n                            }\n                            markup += item.text;\n                            markup += '';                     \n                            return markup;\n                        }\n                    },\n                    onChange: function(value) {\n                        city = $(this.$dropdown).parent().siblings('.select2-city')[0].selectize;\n                        if (!value.length){city.clearOptions(); return;};                           \n                        city.disable();\n                        city.clearOptions();\n                        city.load(function(callback) {\n                                                        xhr &amp;&amp; xhr.abort();\n                                                        xhr = $.ajax({\n                                                                        url: draSite + '?index.php&amp;option=com_dratransport&amp;view=',\n                                                                        dataType: 'json',\n                                                                        data:{\n                                                                            selected: value,\n                                                                            task: 'getCities',\n                                                                        },\n                                                                        success: function(results) {\n                                                                            city.enable();\n                                                                            callback(results);\n                                                                        },\n                                                                        error: function() {\n                                                                            callback();\n                                                                        }\n                                                        });\n                                                    });\n                    },\n\n              });\n\n$city = $('.select2-city').selectize({\n    valueField: 'value',\n    labelField: 'text',\n    searchField: ['text'],\n    sortField: 'sort',\n    sortDirection: 'ASC',\n    diacritics:true,\n});\n\nfor(var i = 0; i<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>I did it like that. It works but I hope this is a good way for doing this. var xhr , a; var country, $country; var city, $city; $country = $(&#8220;.select2-country&#8221;).selectize({ render: { option: function(item, escape) { var markup = &#8220;&#8221;; if (item.value !== undefined &amp;&amp; item.value != 0) { markup += &#8216; &#8216;; } [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2861","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2861","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=2861"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2861\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=2861"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=2861"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=2861"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}