locked
problem with WinJS.xhr with WCF rest post method

    Question

  • The JSON data is not passing to WCF via winjs.xhr. Its always passing the value as null to WCF method .

    Can anybody help to resolve this issue with an example. I am using WebInvoke method=POST etc and passing the data with json.stringify

    Wednesday, October 24, 2012 5:51 PM

Answers

  • Hi,

    You forget to define the contenttype in headers, so just change the code as follow:

    function CallData() {
     
           var person = { "Name": "Name", "Age": 24 };
                 WinJS.xhr({
                    type: "POST",                
                    url: "http://localhost:9814/Student.svc/GetStudentDataInput",
                    headers: { "Content-type": "application/json; charset=utf-8" },
                    data: JSON.stringify(person)
                }).then(function complete(request) {
                   stuListNew = JSON.parse(request.responseText);
                }, function error(er) {
                    var err = er.responseText;
                });
     }


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework


    • Edited by Song Tian Thursday, October 25, 2012 6:34 AM
    • Marked as answer by Song Tian Thursday, October 25, 2012 7:11 AM
    Thursday, October 25, 2012 5:05 AM

All replies

  • Hi,

    One point I want to say, you have to handle the function in winjs.xhr().then(), but after that.

    For example:

     var feedItems = [];
    
    
        function loadBlogFeedsFromWebAsXML() {
    
            var feedUrl = "http://blogs.msdn.com/b/windowsstore/rss.aspx";
    
            WinJS.xhr({ url: feedUrl }).then(
            function (result) {
    
                var xmlDoc = new Windows.Data.Xml.Dom.XmlDocument();
                xmlDoc.loadXml(result.responseText);
    
                var nodes = xmlDoc.selectNodes("//item");
    
                var items = new Array();
    
                nodes.forEach(function (val, idx, travObj) {
    
                    var title = val.selectSingleNode("title").innerText;
                    var description = val.selectSingleNode("description").innerText;
                    var link = val.selectSingleNode("link").innerText;
    
                    var newItem = {
                        title: title,
                        summary: description,
                        uri: link
                    };
    
                    items.push(newItem);
                });
    
                DataUtils.feedItems = items;
    
    
                // Call other function which you want to do
            },
            function (err) {
            }
            );
    
            return DataUtils.feedItems;
        }
    
    
    
    
    
        WinJS.Namespace.define(
            "DataUtils", {
                feedItems: feedItems
            }
            );


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework

    Thursday, October 25, 2012 3:53 AM
  • d

    IStudent.cs *********** [WebInvoke(Method = "POST", UriTemplate = "/GetStudentDataInput", ResponseFormat = WebMessageFormat.Json, BodyStyle=WebMessageBodyStyle.WrappedResponse)] string GetStudentDataInput(string id); Student.svc.cs ************** public string GetStudentDataInput(string id) { return id; } WinJS call to WCF ***************** function CallData() { var person = { "Name": "Name", "Age": 24 }; WinJS.xhr({ type: "POST", url: "http://localhost:9814/Student.svc/GetStudentDataInput", data: JSON.stringify(person) }).then(function complete(request) { stuListNew = JSON.parse(request.responseText); }, function error(er) { var err = er.responseText; }); } Web.config ************ <system.serviceModel> <services> <service name="StudentService.Service1" behaviorConfiguration="ServiceBehaviour"> <endpoint binding="webHttpBinding" contract="StudentService.IStudent" behaviorConfiguration="webhttpconfig"></endpoint> </service> </services> <behaviors> <serviceBehaviors> <behavior name="ServiceBehaviour"> <serviceMetadata httpGetEnabled="true" httpsGetEnabled="true"/> <serviceDebug includeExceptionDetailInFaults="true"/> </behavior> </serviceBehaviors> <endpointBehaviors> <behavior name="webhttpconfig"> <webHttp/> </behavior> </endpointBehaviors> </behaviors> <protocolMapping> <add binding="webHttpBinding" scheme="http" /> </protocolMapping> <serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" /> </system.serviceModel>

    Please find the above code snippet which we are using for WinJS to WCF.

    Always the value which we passing from WinJS.xhr is coming as null in  public string GetStudentDataInput(string id).


     
    Thursday, October 25, 2012 4:11 AM
  • Hi,

    You forget to define the contenttype in headers, so just change the code as follow:

    function CallData() {
     
           var person = { "Name": "Name", "Age": 24 };
                 WinJS.xhr({
                    type: "POST",                
                    url: "http://localhost:9814/Student.svc/GetStudentDataInput",
                    headers: { "Content-type": "application/json; charset=utf-8" },
                    data: JSON.stringify(person)
                }).then(function complete(request) {
                   stuListNew = JSON.parse(request.responseText);
                }, function error(er) {
                    var err = er.responseText;
                });
     }


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework


    • Edited by Song Tian Thursday, October 25, 2012 6:34 AM
    • Marked as answer by Song Tian Thursday, October 25, 2012 7:11 AM
    Thursday, October 25, 2012 5:05 AM
  •  Issue got resolved. I was given json value in wrong format which caused the issue.
    var person = { "Name": "Name", "Age": 24 };

    var person = '{"Name":"Name", "Age":"30"}';

    function CallData() {
     
    	var person = '{"Name":"Name", "Age":"30"}';
                 WinJS.xhr({
                    type: "POST",                
                    url: "http://localhost:9814/Student.svc/GetStudentDataInput",
                    headers: { "Content-type": "application/json; charset=utf-8" },
                    data: JSON.stringify(person)
                }).then(function complete(request) {
                   stuListNew = JSON.parse(request.responseText);
                }, function error(er) {
                    var err = er.responseText;
                });
     }

    Thursday, October 25, 2012 7:02 AM