autocomplete-remote multiple returns undefined error on json data returned from asp.net 2.0 webservice
in Using jQuery UI
•
10 years ago
Hi, I have a hard time getting this one work. please give some hint and I have some deadline to make.
here is the web service
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string GetJsonMemberCodes(string term)
{
suggestions = new List<Members>();
Data dt = new Data();
suggestions = dt.GetJsonMemberCodes(term);
}
return new JavaScriptSerializer().Serialize(suggestions);
}
return new JavaScriptSerializer().Serialize(suggestions);
}
here is the data the server web service returned.
<?xml version="1.0" encoding="utf-8" ?>
<string xmlns="http://tempuri.org/">[{"ID":"106720","LABEL":"106720","VALUE":"106720},{ID":"106729","LABEL":"106729","VALUE":"106729"}]</string>
here is the page that is calling it
<
link type="text/css" href="../../App_Themes/css/base/jquery.ui.all.css" rel="stylesheet" /> <script type="text/javascript" src="../../Scripts/js/jquery-1.4.2.js"></script> <script type="text/javascript" src="../../Scripts/js/ui/jquery.ui.widget.js"></script> <script type="text/javascript" src="../../Scripts/js/ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../Scripts/js/ui/jquery.ui.position.js"></script> <script type="text/javascript" src="../../Scripts/js/ui/jquery.ui.autocomplete.js"></script> <link type="text/css" href="../../App_Themes/css/demos.css" rel="stylesheet" /> <style type="text/css">.ui-autocomplete-loading { background: white url('~/images/ui-anim_basic_16x16.gif') right center no-repeat; }
</style> <script type="text/javascript">$(
function() { function split(val) { return val.split(/,\s*/);}
function extractLast(term) { return split(term).pop();}
$(
"input[ID*='txtMemberID']").autocomplete({// source: function(request, response) {
// $.getJSON("RptMemberIDAutoComplete.asmx/GetJsonMemberCodes", {
// term: extractLast(this.value)
// }, response);
// },
// $.jsonService({url: 'RptMemberIDAutoComplete.asmx',method: '/GetJsonMemberCodes',params: extractLast(this.value)});
// },
source:
function(request, response) {$.ajax({
type:
"POST",url:
"RptMemberIDAutoComplete.asmx/GetJsonMemberCodes",contentType:
"application/json; charset=utf-8",dataType:
"json",data:
"{'term': '" + extractLast(this.value) + "'}",success:
function(result) {alert(result.d);//
// response($.map(data, function(item) {
// return {
// ID:item.ID,
// label: item.ID,
// value: item.ID
// }
// }))
}
});
},
search:
function() { // custom minLength var term = extractLast(this.value); if (term.length < 2) { return false;}
},
focus:
function() { // prevent value inserted on focus return false;},
select:
function(event, ui) { var terms = split( this.value ); // remove the current inputterms.pop();
// add the selected itemterms.push( ui.item.value );
// add placeholder to get the comma-and-space at the endterms.push(
""); this.value = terms.join(", "); return false;}
});
});
</script><
input id="txtMemberID" size="50" />
1