SOAP/XML via AJAX

by Luis Valle

CSS

html, body {
  font-family: Arial;
}
table {
  border-collapse: collapse;
  margin-left: auto;
  margin-right: auto;
}
table th {
  padding: 4px;
  background-color: black;
  color: white;
  border: 1px solid gray;
}
table td {
  padding: 4px;
  background-color: white;
  border: 1px solid black;
}
table tr:hover td {
  background-color: #eaeaea;
  color: #b77d00;
  cursor: pointer;
}

JavaScript

(function () {
	/*var xmlTable = '<table>' +
  	'<tr><th>One</th><th>Two</th><th>Three</th></tr>' +
    '<tr><td>1-1</td><td>1-2</td><td>1-3</td></tr>' +
    '<tr><td>2-1</td><td>2-2</td><td>2-3</td></tr>' +
    '<tr><td>3-1</td><td>3-2</td><td>3-3</td></tr>' +
    '<tr><td>4-1</td><td>4-2</td><td>4-3</td></tr>' +
  	'</table>';*/
    
    var xmlTable = '<MyTable>' +
        '<MyRecord>' +
        '<Col_1>test</Col_1>' +
        '<Col_2>1234</Col_2>' +
        '</MyRecord>' +
        '<MyRecord>' +
        '<Col_1>Record 2</Col_1>' +
        '<Col_2>2</Col_2>' +
        '</MyRecord>' +
        '</MyTable>';
        
	AJAXcall(xmlTable)
  .then(function (tblXML) {
  	if (tblXML.error) {
    	alert(tblXML.errorCode);
    } else {
    	//var xThe = $(tblXML).find('tr').each(function () {
      	//var _thisTx = this;
        
      //});
  		//$(document.body).append($(tblXML).find('table')[0].outerHTML);
      
      var htmlTable = '<table><tr>';
      $(tblXML).find('MyTable').find('MyRecord').eq(0).children().each(function (i, tag) {
      	//console.log($(tag).prop('tagName'));
        console.log(i);
      	htmlTable += '<th>' + $(tag).prop('tagName') + '</th>';
      });      
      htmlTable += '</tr>';
      
      $(tblXML).find('MyTable').find('MyRecord').each(function () {
      	var _this = this;
        htmlTable += '<tr>';
        $(_this).children().each(function (i, tag) {
        	//console.log($(k).html());
          htmlTable += '<td>' + $(tag).html() + '</td>';
        });
        htmlTable += '</tr>';
      });
      htmlTable += '</table>';
      
      $(document.body).append(htmlTable);
    }
  });
})();

function AJAXcall(xmlParams) {
  var d = $.Deferred();

    $.ajax({
    	type: 'POST',
      url: "/echo/xml/",
      data: {
      	xml: xmlParams
      },
      dataType: 'xml'
    })
    .done(function (response) {
      d.resolve(response);
    })
      .fail(function (jqXHR, textStatus, errorThrown) {                
      errorThrown...