Status: Solved
Priority: Medium
Security: Public
Views: 377
Last Modified: 2015-04-13

xml jquery

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>

ITsolutionWizard

Asked: 2015-04-12

Advertise Here

1 Solution

LVL 10

Duy PhamFreelance IT ConsultantCommented: 2015-04-13

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.

LVL 1

ITsolutionWizardAuthor Commented: 2015-04-13

OK then how can I get the Data from XML format?

LVL 10

Duy PhamFreelance IT ConsultantCommented: 2015-04-13

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/.

LVL 1

ITsolutionWizardAuthor Commented: 2015-04-13

Please show me in codes..

LVL 1

ITsolutionWizardAuthor Commented: 2015-04-13

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

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

LVL 10

Duy PhamFreelance IT ConsultantCommented: 2015-04-13

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.

LVL 1

ITsolutionWizardAuthor Commented: 2015-04-13

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

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

xml jquery

Join & Write a Comment Already a member? Login.

Featured Post