Jquery的Ajax调用Web service的function返回xml格式的数据集

之前有整理过,今天特地做了关于返回xml格式数据集呈现到html的table里面

下面就直接贴代码,大家只需要改想对应的地方就可以直接用,

下面例子是返回两列数据,并在table呈现出来


Web service

Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports system.Web.Script
Imports System.Data
Imports System.Xml






<WebService(Namespace:="http://tempuri.org/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
<System.Web.Script.Services.ScriptService()> _
Public Class WebService
    Inherits System.Web.Services.WebService
    Dim str As String = PublicFunction.getconnStr("ldsfisdb")

    <WebMethod()> _
    Public Function HelloWorld() As String
        Return "Hello World"
    End Function

    <WebMethod()> _
     Public Function Getxmlds() As DataSet
        Dim SQL As String
        Dim i As Integer
        Dim ds2, ds As DataSet
        ds = New DataSet

        SQL = "select SERIAL_NUMBER,POSITION from sfism4.u_sn_tracking_t where mo_number='3S1170048MA' and board_number='KEHJFDY'"
        ds2 = OracleHelper.ExecuteDataset(str, CommandType.Text, SQL)
        Dim DT As DataTable = New DataTable()
        DT.Columns.Add("SERIAL_NUMBER", Type.GetType("System.String"))
        DT.Columns.Add("POSITION", Type.GetType("System.String"))
        Dim DR As DataRow = DT.NewRow()
        If ds2.Tables(0).Rows.Count > 0 Then
            For i = 0 To ds2.Tables(0).Rows.Count - 1
                DT.Rows.Add(ds2.Tables(0).Rows(i).Item("SERIAL_NUMBER").ToString(), ds2.Tables(0).Rows(i).Item("POSITION").ToString())
            Next
            ds.Tables.Add(DT)
        End If

        Return ds
    End Function
End Class
html code

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
    <style>
       body {font-family:georgia;font-size:12px;}
         #books {
         border:1px solid #E77D2C;
          -moz-border-radius: 5px; 
          -webkit-border-radius: 5px;
          width:400px;
          list-style-type:none;
          margin:0;
          padding:0;
         }
         #books li {
                padding:5px;
                   }
         #books h1 {
                font:14px georgia;
                padding:5px;
                color:#fff;
                background:#E77D2C;
                margin:0;
                   }
       </style>
    <script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
    
    
    <script>
     $(document).ready(function(){
               $.ajax({
                    type: "POST",
                    url: "../WebService.asmx/Getxmlds",
                    data:{},// {line:tline,shift:tshift,area:tarea}
                    dataType: 'xml', //返回的类型为XML ,和前面的Json,不一样了
                    success: function(result) {
                    //演示一下捕获
                        try { 
                            $(result).find("Table1").each(function() {
                           
                               $('#tbd1').append('<tr class="bsty" border="1px"><td  >'+$(this).find("SERIAL_NUMBER").text()+'</td>\
                                               <td  >'+$(this).find("POSITION").text()+'</td>\
                                               </tr>      ');                                      
                            
                            });
                        }
                        catch (e) {
                                   alert(e);
                             
                            return;
                        }
                    },
                    error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数
                        if (status == 'error') {
                            alert(status);
                           
                        }
                    }
                });                   
          });     
     
     </script>
     
     
     
     
</head>
<body>
<ul id="books">
<h1>My Favorite Books</h1>
    <table style="width: 400px; height: 56px" id="tb1" border="1px">
       <tbody id="tbd1" ></tbody>
    </table>
</ul>
    
</body>
</html>
显示效果


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

cheug

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值