关于 view 前台JQuery.ajax 调用 WCF

在http://www.cnblogs.com/lei2007/archive/2013/02/20/2919326.html 中Demo3 是跨域调用的Demo,这里总结一下 ajax同域调用的Demo

本Demo: 是Ajax 以 post 方式 调用WCF 接口方法

第一：前台view:

注意点：parval 获取变量后在url 传值需转换成 json 参数类型，即需要字符串转义(在字符串前\转义)。第一次遇到此问题耗时较长，使用get方式可以传值，但由于参数字节较长，所以改成post，可以调到接口方法但参数为空，究其原因是参数类型是字符串非json格式。

 

$("#btnGetInfo").click(function () {



                var url = "JsonDataService.svc/PostJsonICService";



                var parval = $("#T1").val();



                var funcname = "UploadClassInfo";



                var parNum = "1";



                $.ajax({



                    type: "post",



                    contentType: "text/json",



                    dataType: "json",



                    url: url,



                    data: '{ "FuncName":"' + funcname + '","ParamNum":"' + parNum + '","ParamValue":"ds|*|' + parval + '|#|"}',



                    success: function (result) {



                        jQuery("#IDRESULT").html(result);



                    },



                    error: function (XMLHttpRequest, textStatus, errorThrown) {



                        alert(XMLHttpRequest.status);



                        alert(XMLHttpRequest.readyState);



 



                    }



                });



            });



 



        });

View Code

 

 

第二：后台接口:

注意点：如果使用 get方式应是 WebGet，如果使用Post方式 WebInvoke。默认支持json ，还可以xml，注意参数类型。

契约接口：



[OperationContract]



        [WebInvoke(ResponseFormat = WebMessageFormat.Json, RequestFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)]



        string PostJsonICService(string FuncName, string ParamNum, string ParamValue);



契约方法实现：



public string PostJsonICService(string FuncName, string ParamNum, string ParamValue)



{}

svc Code

 

 

 

第三：Webconfig 配置:

注意点：同域调用，即在一个解决方案里面，所以不需要 添加引用服务。之间在view使用ajax调用即可。

跨域调用注意 配置，详见：http://www.cnblogs.com/lei2007/archive/2013/02/20/2919326.html

以上三点是亲自测试的过，下面是参考前辈的，注意参数传值。

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("调用出错" + error.responseText);

 



                }                

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