Ahmad Ahmad - 2 years ago 97
Javascript Question

Data is not appending to Dropdown without page refresh?

Hi everyone i am facing a weird problem, i am appending my drop downdata from jquery (fSlect Plugin) Plugin link

it is my select in html

<select name="ownerparm" class="demo" multiple="multiple" id="addownok">

and this is my function for appending data options

function Preload7()
console.log("i am called preload7");
$.getJSON("/FrontEnd/resources/getowner", function (jsonData) {
$.each(jsonData, function (i, j) {

$("#addownok").append($("<option value="+j.societyOwnerId+"></option>").html(j.socityOwnersNames));



without refresh of page whenever i try to call
function data is not appending to drop down, if i remove fSelect plugin then it will work fine(and if i Refresh page then it will append data with fSelect also) i want this without refreshing the page,

as you see when first time i load my application data is properly append in option and in fSelect DOM,
enter image description here

now when i add another owner it cannot append to fSelect DOm

enter image description here

as a result only 3 options is displayed in dropdown
enter image description here

please tell me how to do this witout refreshing page i am waste my 3 days on it but i am not able to do it ?

Answer Source

The plugin has some exposed API functions, such as create, reload, destroy


should reload the options after changes, but it also duplicates the search box,

Alternate solution,


hope this helps.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download