jQuery实现Ajax功能示例续 -- 读取dataset-优快云博客

　　此文为上一个例子的延续，是json数据类型读取数据库中的字段。但是，有时我们需要读取整张表，或者是读取几个字段的信息。这时假如还继续使用list的形式就不太对了。我想能不能就把Dataset 对象传到页面中。这样不就解决了问题，dataset中数据对象的格式是xml，所以，页面中直接来处理xml就能把数据拿到我们的控件里了。现在我们看看应该怎么改上一例子的代码。

　　1.首先，我们要改动webservice中的方法的返回值类型。以下代码有什么不同呢？很明显，我加了ResponseFormat，将response类型改为xml. 然后修改返回值类型为xml.

 <WebMethod()> _
    <ScriptMethod(ResponseFormat:=ResponseFormat.Xml)> _
Public Function LoadOrderNbrs(ByVal strSSOrderNbr As String, ByVal strSSLineNbr As Integer, ByVal instanceName As String) As String
Dim dtOrders As DataSet
        dtOrders = bzLayerObj.LoadOrderNbrs(strSSOrderNbr, strSSLineNbr, instanceName)

'Dim list As New List(Of String)()
        'Dim s As String

'For Each row As DataRow In dtOrders.Rows
        '    s = row.Item("ORDER_NUMBER")
        '    If s <> String.Empty Then
        '        list.Add(s)
        '    End If
        'Next row
        Return dtOrders.GetXml()
End Function

　　2.看看jQuery是怎么读取xml文件的。这里要注意两点， datatype 一定要改成xml。还有一点就是， contentType 后面要加charset=utf-8。这个我也不清楚为什么，可能是字符解析问题，反正加上吧！

// ajax get data
        $().ready(function() {
            $("#btnOrderNbr").click(function() {
                $("#btnApply").hide();
                $("#resultDiv").hide();
                $('#<%=ddlOrderNbrs.ClientID%> > option').remove();
                $('#<%=ddlooline.ClientID%> > option').remove();
                var ordNum = $("#txtSSOrderNbr").val();
                var lineNum = $("#txtSOline").val();
                var lblmsg = $("#<%=lblerror.ClientID %>");
if (ordNum.trim() == "") {
                    lblmsg.html("please input sales office order number");
return false;
                } else if (lineNum == 0 || lineNum == null) {
                    lblmsg.html("please input sales office line number");
return false;
                }
else {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json;charset=utf-8;",
                        url: "OrderNumService.asmx/LoadOrderNbrs",
                        data: "{strSSOrderNbr:'" + ordNum + "',strSSLineNbr:'" + lineNum + "',instanceName:'" + GetInstanceName() + "'}",
                        dataType: 'xml',
                        success: showAjaxResult,
error: function(XMLHttpRequest, textStatus, errorThrown) {
                            lblmsg.ajaxError(function(event, request, settings) {
                                $(this).append("<li>Error requesting page " + settings.url + "</li>");
                            });
                        }
                    });
                }
            });

　　3. showAjaxResult 代码

function showAjaxResult(xml) {
//debugger;
                try {
var ddlordernbrs = $('#<%=ddlordernbrs.clientid%>');
var ddlooline = $('#<%=ddlooline.clientid%>');
//message
                    var lblmsg = $("#<%=lblerror.ClientID %>");
var btnApply = $("#btnApply");
var rltDiv = $("#resultDiv");
if ($(xml).find('Table').length > 0) {
                        rltDiv.show();
                        btnApply.show();
                        lblmsg.html("");
                        $(xml).find('Table').each(function() {
var orderNbr = $(this).find('ORDER_NUMBER').text();
var lineNbr = $(this).find('LINE_NUMBER').text();
                            ddlordernbrs.append($("<option value='" + orderNbr + "'>" + orderNbr + "</option>"));
                            ddlooline.append($("<option value='" + lineNbr + "'>" + lineNbr + "</option>"));
                        });
                    } else {
                        rltDiv.hide();
                        btnApply.hide();
                        lblmsg.html("No order number available for this search. ");
                    }
                }
catch (err) {
var txt = "There was an error on this page.\n\n";
                    txt += "Error description: " + err.description + "\n\n";
                    txt += "Click OK to continue.\n\n";
                    alert(txt);
                }
            }