Parsing XML from SOAP response with jQuery/JavaScript

Question

I have problems parsing response from SOAP sever with jQuery. I want to convert XML response to array because there are multiple rows of data as you can see below.

This is request:

<?xml version="1.0" encoding="utf-8"?>
<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
  <soap:Body>
    <GetWorkPos xmlns="http://localhost/apps">
      <id>int</id>
    </GetWorkPos>
  </soap:Body>
</soap:Envelope>

And this is response:

<?xml version="1.0" encoding="utf-8"?>
<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
  <soap:Body>
    <GetWorkPosResponse xmlns="http://localhost.com/apps">
      <GetWorkPosResult>
        <GetWorkPos>
          <ProductId>string</ProductId>
          <Product>string</Product>
          <quantity>decimal</quantity>
          <Em>string</Em>
          <type>string</type>
        </GetWorkPos>
        <GetWorkPos>
          <ProductId>string</ProductId>
          <Product>string</Product>
          <Quantity>decimal</Quantity>
          <Em>string</Em>
          <Type>string</Type>
        </GetWorkPos>
      </GetWorkPosResult>
    </GetWorkPosResponse>
  </soap:Body>
</soap:Envelope>

And this is my code:

   $(document).ready(function () {
   $("#send").click(function (event) {
            var wsUrl = "http://localhost/Service.asmx";

            var soapRequest =
            '<?xml version="1.0" encoding="utf-8"?> \
            <soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" \
                xmlns:xsd="http://www.w3.org/2001/XMLSchema" \
                xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"> \
              <soap:Body> \
                <GetWorkPos xmlns="http://localhost.com/apps"> \
                  <id>' + $("#id").val() + '</id> \
                </GetWorkPos> \
              </soap:Body> \
            </soap:Envelope>';

            console.log(soapRequest);

            $.ajax({
                type: "post",
                url: wsUrl,
                contentType: "text/xml",
                dataType: "xml",
                data: soapRequest,
                success: processSuccess,
                error: processError
            });

        });
    });

    function processSuccess(data, status, req, xml, xmlHttpRequest, responseXML) {
        $(req.responseXML)
        .find('GetWorkPosResult')
        .each(function(){
            var id = $(this).find('ProductId').text();
            console.log(id);
        });
    }

    function processError(data, status, req) {
        alert(req.responseText + " " + status);
        console.log(data);
        console.log(status);
        console.log(req);
    }  

Answer 1

http://jsbin.com/uwirux/edit#javascript,html

var myObj = new Array();

$(req.responseXML)
 .find('GetWorkPosResult').find('GetWorkPos')
        .each(function(){
          myObj.push($(this)); // Should't use .text() because you'll lose the ability to use .find('tagName') 
        });


for(var i = 0; i<myObj.length;i++){
     var x = myObj[i].find('ProductId').text();
     var y = myObj[i]find('Product').text();
}

or

$(myObj).each(function(){
var x = $(this).find('ProductId').text();
var y = $(this).find('Product').text();
});