jQuery AutoComplete with JSON:
<input name="txt_search" type="text" id="txt_search" />
.
.
.
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
.
.
.
jQuery("#txt_search").autocomplete({
source: function(request, response) {
$.ajax({
url: "search.jsp",
type: "POST",
dataType: "json",
data: { searchStringParam: request.term},
success: function( data ) {
response( $.map( data, function( item ) {
return {
label: item.value,
value: item.value,
}
}));
},
error: function (error) {
var obj = jQuery.parseJSON(error);
alert('error: ' + obj.value);
}
});
},
minLength: 2
});
Search.jsp:
[
{"value":val1},
{"value":val2},
]
<input name="txt_search" type="text" id="txt_search" />
.
.
.
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
.
.
.
jQuery("#txt_search").autocomplete({
source: function(request, response) {
$.ajax({
url: "search.jsp",
type: "POST",
dataType: "json",
data: { searchStringParam: request.term},
success: function( data ) {
response( $.map( data, function( item ) {
return {
label: item.value,
value: item.value,
}
}));
},
error: function (error) {
var obj = jQuery.parseJSON(error);
alert('error: ' + obj.value);
}
});
},
minLength: 2
});
Search.jsp:
[
{"value":val1},
{"value":val2},
]