使用 jQuery AJAX 将数据集绑定到 ASP.Net Div 标签

Question

Iam Binding 在 Div 标记内。现在 iam 使用中继器内的数据集从 db 获取数据。每次页面加载从 db 获取数据，我想避免。所以我决定使用 Jquery ajax 绑定数据集。我的问题是如何在 div 标签内绑定数据集。

我的代码是：

   <asp:Repeater ID="rep" runat="server" 
    OnItemDataBound="rep_ItemDataBound">   <ItemTemplate>
        <div>
            <p><%#Eval("message") %></p>
        </div>
         </ItemTemplate>
        </asp:Repeater>

代码背后：

[WebMethod]
    public static string GetMessages()
    {
        string query = "GetMessageData";
        SqlCommand cmd = new SqlCommand(query);
        cmd.CommandType = CommandType.StoredProcedure;
        return GetData(cmd).GetXml();
    }
    private static DataSet GetData(SqlCommand cmd)
    {
        string strConnString = ConfigurationManager.ConnectionStrings["connectionng"].ConnectionString;
        using (SqlConnection con = new SqlConnection(strConnString))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter())
            {
                cmd.Connection = con;
                sda.SelectCommand = cmd;
                using (DataSet ds = new DataSet())
                {
                    sda.Fill(ds);
                    return ds;

                }
            }
        }
    }

Javascript：

$(function () {
    $.ajax
    ({
        type: "POST",
        url: "welcome.aspx/GetMessages",
        data: '{}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: OnSuccess,
        failure: function (response) {
            alert(response.d);
        },
        error: function (response) {
            alert(response.d);
        }
    });
});

function OnSuccess(response) {
    var xmlDoc = $.parseXML(response.d);
   --Iam stuck Here--

}

如果成功，我如何将我的数据集绑定到中继器内的 div 标签。

Answer 1

您真正需要做的就是遍历 $.ajax 调用返回的 XML，并将结果附加到页面上的元素。

1.在页面的任意位置添加<div id="result"></div>。我们会将$.ajax 调用的输出写入此元素。

2. 像这样更改您的OnSuccess() 函数：

function OnSuccess(response) {
    var xmlDoc = $.parseXML(response.d);
    var length = xmlDoc.children[0].children.length;
    $("#result").empty();

    for(var i = 0; i < length; i++)
    {
        var item = xmlDoc.children[0].children[i];
        var message = item.getElementsByTagName("message")[0].innerHTML;
        var div = "<div><p>" + message + "</p></div>";
        $("#result").append(div);
    }
}