About view front-end JQuery. ajax asynchronous calling of WCF

In http://www.cnblogs.com/lei2007/archive/2013/02/20/2919326.html

Demo3 is a Demo of cross-origin calls. Here we will summarize the Demo of ajax asynchronous and same-domain calls.

First: view layer code:

// Use the get method. The data format is the same as the time. The post method uses the JSON format by default. Function funAjaxWcf () {jQuery. ajax ({type: "post", dataType: "json", url: "StudioMenuInitService. svc/Hello ", contentType:" application/json; charset = UTF-8 ", success: function (json) {// The result is encapsulated in json. the members or data defined in the Data contract can be retrieved from alert (json. d)}, error: function (error) {alert ("call error" + error. responseText );}});}

View Code

 

2. WebConfig Configuration:

<Behaviors> <serviceBehaviors> <behavior name = "Web. studioMenuInitServiceBehavior "> <serviceMetadata httpGetEnabled =" true "/> <serviceDebug includeExceptionDetailInFaults =" false "/> </behavior> </serviceBehaviors> <! -- Add an endpoint Behavior named AjaxBehavior and add an enableWebScript node to it, <endpointBehaviors> <behavior name = "AjaxBehavior"> <enableWebScript/> </behavior> </endpointBehaviors> </behaviors> <services> <! -- <Service> A node has two attributes: The name (namespace + class name) of the class implementing the service and the behavior name of the behaviorConfiguration service, which can be blank. --> <service behaviorConfiguration = "Web. studioMenuInitServiceBehavior "name =" Web. studioMenuInitService "> <! -- Specify the service contract type, Binding, and Behavior of the Service --> <! -- <Address>: Specifies the enpoint address. The Url must be in a valid Url format, so that the relative path or absolute path can be used. The address attribute value can be null, but this attribute must exist. If the address value is blank, the address is the address in the baseAddresses defined previously. <BindingConfiguration>: Optional. Do not set this value unless you have a custom binding policy. <Bingding>: Specifies the binding policy used. This attribute is required. <Contract>: This attribute is also a required attribute. It specifies the type of the service contract. We recommend that you use interfaces to define the contract and use the full name of the interface here. (If there is no interface definition, you can also use namespace + class name to define it ). --> <! -- Use webHttpBinding unless a custom binding policy exists and indicates that the above-defined AjaxBehavior is used --> <endpoint address = "" binding = "webHttpBinding" contract = "Web. IStudioMenuInitService "behaviorConfiguration =" AjaxBehavior "> </endpoint> </service> </services>

Webconfig Code

 

Figure:

Third: configuration in wcf

 

The above three points have been tested in person. The following is a reference to the predecessors. Pay attention to parameter value passing.

View Code

Function call () {var id = Number ($ ("# id "). val (); var title = String ($ ("# title "). val (); var content = String ($ ("# content "). val (); $. ajax ({type: "post", url: "http: // localhost: 7000/Service1.svc/Request", data: '{"id":' + id + ', "title": "'+ title +," content ":"' + content + '"}', contentType:" application/json; charset = UTF-8 ", success: function (json) {alert (json)}; error: function (error) {alert ("call error" + error. responseText );}

Http://www.cnblogs.com/happycat1988/archive/2013/04/09/3009263.html