We help IT Professionals succeed at work.

xml jquery

ITsolutionWizard
ITsolutionWizard asked
on
Do you know why it does not show the result in chrome? But it shows on IE 9?
I am able to see the response data shown in google chrome (F12)


An exact error it shown

XMLHttpRequest cannot load http://clientaccesstest.usa.com/wcf/proquotes/RestService/QuoteService/GetNetPrice(066,335281,[AAS3602I],[1],1,SA7)?_=1428685312396.
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:62937' is therefore not allowed access.


The result should be in xml format from wcf services.

           
        #region GetNetPrice
        [OperationContract]
        [WebGet(ResponseFormat = WebMessageFormat.Xml, UriTemplate = "QuoteService/GetNetPrice({CompanyID},{CustomerNo},{Model},{Qty},{OrderDate},{RepNo})")]
        String GetNetPrice(string CompanyID, string CustomerNo, string Model, string Qty, string OrderDate, string RepNo);
        #endregion


<script type="text/javascript">
    function GetNetPrice() {
         var GetNetPriceJSon = "http://clientaccesstest.usa.com/wcf/orders/RestService/QuoteService/GetNetPrice";
         //url: GetNetPriceJSon + encodeURIComponent("(066,335281,[AAS3602I],[1],1,SA7)"),
         //var GetNetPriceJSon = "http://clientaccesstest.usa.com/wcf/orders/RestService/QuoteService/GetNetPrice(066,335281,[AAS3602I],[1],1,SA7)";          
         var companyID = "066";
         var dealerNo = "335281";
         var modelNo = "[AAS3602I]";
         var qty = "[1]";
         var orderDate = "1";
         var repNo = "SA7";
         var allInfo = "(" + companyID + "," + dealerNo + "," + modelNo + "," + qty + "," + orderDate + "," + repNo + ")";

         $(document).ready(function () {
            $.ajax({
                crossDomain: true,
                cache: false,
                type: "GET",
                async: false,
                dataType: "text/xml; charset=utf-8", // result: get this data type from the server
                contentType: "text/plain", //send to the server //text/plain
                url: GetNetPriceJSon + allInfo,
                success: function (data) {
                    alert("Success: Data Below:" + data);
                    resultObj = jQuery.parseJSON(data);                                        
                },
                error: function (xhr, status, error) {
                    //alert(xhr.responseText + " : Error GetNetPriceJSon");
                   
                }
            });
        });
    }
</script>
Comment
Watch Question

View Solution Only

Freelance IT Consultant
Commented:
Firstly, you need to make sure that your WCF REST Service allows cross-site script access, see sample configuration here: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/Q_28653962.html#a40720321.

Then try to set Access-Control-Allow-Origin before sending ajax request as below:
         $(document).ready(function () {
             $.ajax({
                 crossDomain: true,
                 cache: false,
                 type: "GET",
                 async: false,
                 contentType: "text/plain", //send to the server //text/plain
                 url: GetNetPriceJSon + allInfo,
                 success: function (data) {
                     alert("Success: Data Below:" + data);
                     resultObj = jQuery.parseJSON(data);                                        
                 },
                 error: function (xhr, status, error) {
                     //alert(xhr.responseText + " : Error GetNetPriceJSon");
                 },
                beforeSend: function (xhr) {
                    xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
                }
             });
         });

Open in new window


On the other hand, your service method returns data in Xml format, then I don't think resultObj = jQuery.parseJSON(data); will work. Also, you might want to remove dataType: "text/xml; charset=utf-8" from above ajax call to avoid conversion error later.
ITsolutionWizard

Author

Commented:
OK then how can I get the Data from XML format?
Duy PhamFreelance IT Consultant

Commented:
You will need to parse the XML yourself (e.g.: using jQuery.parseXML()) or find a generic library to help converting XML to JSON such as http://goessner.net/download/prj/jsonxml/.
ITsolutionWizard

Author

Commented:
Please show me in codes..
ITsolutionWizard

Author

Commented:
I have error message 405 (Method Not Allowed) when I try using below codes

 beforeSend: function (xhr) {
                    xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
                }
Duy PhamFreelance IT Consultant

Commented:
To solve issue of 405 error, try to add Global.aspx class to your WCF service, and add below code to Global.aspx.cs
        protected void Application_BeginRequest(object sender, EventArgs e)
        {
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
            if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
            {
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST");

                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Access-Control-Allow-Origin, Content-Type, Accept");
                HttpContext.Current.Response.End();
            }
        }

Open in new window

Note that for security reason, in production you might want to change Access-Control-Allow-Origin from * to only the trusted domains you want to allow cross-site script access.
ITsolutionWizard

Author

Commented:
thank you. I may be able to get it working.

I have one more if you have time.
http://www.experts-exchange.com/Programming/Languages/.NET/ASP.NET/Q_28655061.html