Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / web / CSS

Calling an ASMX webservice from other server using jquery and PHP

0.00/5 (No votes)
25 Jun 2014CPOL1 min read 9.4K  
Calling an ASMX webservice from other server using jquery and PHP

Introduction

Few months back i have got a requiremnet of fetching some inventory data from a server and show it to a html page. The interesting fact was the client server(the one which i want to show the datas , does not support dot net files).If it support we can directly add the web references and display the datas.So what to do. I have tried JSONP, Angular Json but i could not make it to work. Then i came up with an another idea.

Background

Here i have ,
1  A webservice which gets the datas from the SQL Server 2008 DB in the  HTML format.

2. One HTML file where we need to show the datas

3. Jquery latest version js file 

Using the code

So lets start.

make a html table in the file like following

HTML
 <table id="inventory">
        <tr id="maintr">
                <th>
                   LOCATION </td>
                 <th>
                  20 GP </td>
                   <th>
                   40 FC </td>
                    <th>
                      40 GP
                    </th>
                     <th>
                      40 OT
                      </th>
                      <th>
                      40 HCGP
                 </th>
          </tr>
 </table>

Add the following line to the file

JavaScript
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>

Add the styles to the table

HTML
<style type="text/css">
        #inventory
        {
            font-family: "Trebuchet MS" , Arial, Helvetica, sans-serif;
            width: 600px;
            border-collapse: collapse;
        }
        
        #inventory td
        {
            font-size: 10pt;
            border: 1px solid #25aacc;
            padding: 3px 7px 2px 7px;
        }
        #inventory th
        {
            font-weight: bold;
            font-size: 10pt;
            text-align: left;
            padding-top: 5px;
            padding-bottom: 4px;
            background-color: #25aacc;
            color: #fff;
            padding: 3px 7px 2px 7px;
            border: 1px solid #25aacc;
        }
        
        #inventory tr.normal td
        {
            font-size: 10pt;
            color: #000;
            background-color: #ecf6f8;
        }
        
        #inventory tr.alt td
        {
            font-size: 10pt;
            color: #000;
            background-color: #c0e6ef;
        }
    </style>

Add the following Sripts to get the datas from the web service

 

JavaScript
<script type="text/javascript">
        var gp20;
        var gp40;
        var fc40;
        var ot40;
        var hcgp40;
        $(document).ready(function () {
            $("#accordion").accordion();
            $.post("RetWS.php", {
                action: "test"
            },
            function (data) {
                var className;
                var i = 0;
                var xdoc = $.parseXML(data),
                $xml = $(xdoc);
                $($xml).find('AvailableSaleUnitsDetail').each(function () {
                    if (i % 2 != 0) {
                        className = 'alt';
                    }
                    else {
                        className = 'normal';
                    }
                    if (parseInt($(this).find('_x0032_0GP').text()) > 50) {
                        gp20 = '50 +';
                    }
                    else {
                        gp20 = $(this).find('_x0032_0GP').text();
                    }

                    if (parseInt($(this).find('_x0034_0FC').text()) > 50) {
                        fc40 = '50 +';
                    }
                    else {
                        fc40 = $(this).find('_x0034_0FC').text();
                    }

                    if (parseInt($(this).find('_x0034_0GP').text()) > 50) {
                        gp40 = '50 +';
                    }
                    else {
                        gp40 = $(this).find('_x0034_0GP').text();
                    }

                    if (parseInt($(this).find('_x0034_0OT').text()) > 50) {
                        ot40 = '50 +';
                    }
                    else {
                        ot40 = $(this).find('_x0034_0OT').text();
                    }

                    if (parseInt($(this).find('_x0034_0HCGP').text()) > 50) {
                        hcgp40 = '50 +';
                    }
                    else {
                        hcgp40 = $(this).find('_x0034_0HCGP').text();
                    }

                    $("#inventory").append("<tr class=" + className + " ><td id=" + $(this).find('Location').text() + ">" + $(this).find('Location').text() + "</td> <td>" + gp20 + "</td><td >" + fc40 + "</td> <td>" + gp40 + "</td><td >" + ot40 + "</td><td >" + hcgp40+ "</td> </tr>");
                    i++;
                });
            })

        });

    </script>

Here 

RetWS.php is my php file which actually gets the datas from asmx web service from other server.

in the RetWs.php you can do the following codes

PHP
<?php
if(isset($_POST['action']) && !empty($_POST['action'])) {
    $action = $_POST['action'];
    switch($action) {
        case 'test' : doWebService();
        break;     
    }
}
function doWebService()
{   
  $client = new SoapClient("http://Here paste link to your webservice");
  echo $client->getInventoryForWs()->getInventoryForWsResult;
}
?>

 

the link may look like 

PHP
http://www.something.com/Reports/Marketing/Mywebservice.asmx?WSDL

Make sure that there is no spelling mistakes :)

 

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)