I am trying to populated multi-value dropdown using AJAX, but it does not show the drop down. It stays at "Searching", even though in chrome, I can see the request was already completed and it shows the data in the Network tab of chrome.
Here is my code :
<script>
$(document).ready(function() {
$("#e6").select2({
placeholder: "Search for a person",
minimumInputLength: 2,
ajax: {
url: "http://localhost:8080/cnrs/rest/ids",
dataType: 'jsonp',
data: function (term, page) {
return {
name: term, // search term
page_limit: 10
};
},
results: function(data, page) {
console.log("I am in results " + data);
return { results: data };
}
},
dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
escapeMarkup: function (m) { return m; }
});
});
</script>
</head>
<body>
<div class="container">
<input type="hidden" class="bigdrop" id="e6" style="width:600px" value="16340"/>
</div> <!-- /container -->
</body>
</html>
The data from the ajax call is returned in this format :
[{"id":"id0","text":"text name0"},{"id":"id1","text":"text name1"},{"id":"id2","text":"text name2"},{"id":"id3","text":"text name3"},{"id":"id4","text":"text name4"},{"id":"id5","text":"text name5"},{"id":"id6","text":"text name6"},{"id":"id7","text":"text name7"}]
The console log message is never printed on the console. What am I missing?
Thanks for the help,
Sushma
dataType: 'jsonp',
The data from the ajax call is returned in this format :
[{"id":"id0","text":"text name0"},{"id":"id1","text":"text name1"},{"id":"id2","text":"text name2"},{"id":"id3","text":"text name3"},{"id":"id4","text":"text name4"},{"id":"id5","text":"text name5"},{"id":"id6","text":"text name6"},{"id":"id7","text":"text name7"}]
The console log message is never printed on the console. What am I missing?
I am still getting a javascript error in chrome console "Uncaught TypeError: undefined is not a function ".
Uncaught TypeError: undefined is not a function users?callback=jQuery110207093086519744247_1401898792660&name=sush&page_limit=2&_=1401898792663:1
When I look at the jquery response of this ajax call, it shows
jQuery110207093086519744247_1401898792660([{"id":"0012345","text":"Sushil K "},{"id":"0087654","text":"Sushil R"}])
There is something about my other script that it does not like. So, I am looking at the script. If I find something or do not find the problem, I will post here.
Thanks,
Sushma
any suggestions? multiple select auto complete seems to be working at this point of time and it looks great, but I would rather not have a javascript error.