I had some problem when trying to use jQuery UI autocomplete to get the data from a WCF service, after browsing around i finally found a way to resolve it
In the jQueryUI autocomplete file:
- Change the code for jQuery UI autocomplete , by default it execute an ajax call with GET method, we need to change this to POST
- We need to change the default content type to “application/json” or else there will be an exception when trying to access the WCF service
- The WCF service will try to deserialize the data that we sent and it expect the data that we sent is sent in JSON string format
- eq: {‘term’:’human’} and not ‘term=human’ to do this we can use JSON.stringify method that we can get from http://www.json.org/js.html
In the WCF service file:
We need to decorate our method with this attribute
1 |
[WebInvoke(Method = "POST", ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)] |
The javascript code
1 |
$('#<%= txtTitle.ClientID %>').autocomplete({ source: "/WebPages/Transaction/WebServices/TransactionService.svc/SearchPayeeByName" }); |
The jQuery UI that i use is version v1.8.14