I'm a bit new in jquery using $ajax. I'm implementing it using json. I'm using the automcomplete in combobox
I have a results.aspx which return json results. I just want it to display the results in the combobox autocomplete. the red part of the code is a bit confusing me on how can I do it. Actually I don't know how to handle the
success part...
<SCRIPT type="text/javascript">
(function ($) {
$.widget("ui.combobox", {
_create: function () {
var self = this;
var select = this.element.hide();
var input = $("<input>")
.insertAfter(select)
.autocomplete({
source: function (request, response) {
$.ajax({
url: "results.aspx",
dataType: "jsonp",
success: function (data) {
alert('helo');
return {
label: data[0].id,
value: data[0].name
}
}
})
},
delay: 300,
change: function (event, ui) {
if (!ui.item) {
// remove invalid value, as it didn't match anything
$(this).val("");
return false;
}
select.val(ui.item.id);
self._trigger("selected", event, {
item: select.find("[value='" + ui.item.id + "']")
});
},
minLength: 3
})
.addClass("ui-widget ui-widget-content");
$("<button onclick='return false;'> </button>")
.attr("tabIndex", -1)
.attr("title", "Show All Items")
.insertAfter(input)
.button({
icons: {
primary: "ui-icon-triangle-1-s"
},
text: false
}).removeClass("ui-corner-all")
.addClass("ui-button-icon")
.click(function () {
// close if already visible
if (input.autocomplete("widget").is(":visible")) {
input.autocomplete("close");
return;
}
// pass empty string as value to search for, displaying all results
input.autocomplete("search ", "");
input.focus();
});
}
});
})(jQuery);
$(function () {
$("#combobox").combobox();
$("#toggle").click(function () {
$("#combobox").toggle();
});
});
</SCRIPT>