使用AJAX基于JSON数据设置嵌套在Gridview内部的Label文本

时间:2016-12-08 22:30:27

标签: jquery json ajax

我有一个从vb.net类对象获取数据的网格视图。在这个gridview里面是一个TempleteField,它(当前)有一个标签控件,如此......



<asp:GridView ID="gv1" runat="server" AutoGenerateColumns="False" CssClass="grid3" >
    <Columns>
        <asp:BoundField DataField="Column1" HeaderText="Account Number" />                    
        <asp:BoundField DataField="Column2" HeaderText="Name" />
        <asp:BoundField DataField="Column3" HeaderText="Status" />
        <asp:TemplateField HeaderText="Discount Program">
            <ItemTemplate>
                <asp:HiddenField runat="server" ID="hiddenField1" />
                <asp:Label ID="lblMessage" class="message" runat="server" Text=""></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
&#13;
&#13;
&#13;

我需要根据来自通过AJAX调用的JSON对象的数据更改lblMessage的测试。 JSON Data是用于填充gridview的类对象的单独数据源。它看起来像这样:

{
    "00":
    {
        "Account": "1111",
        "Status": "Y",
        "Message": "Some Message Goes Here"
    },
    "01":
    {
        "Account": "1111",
        "Status": "N",
        "Message": ""
    }
}

由于多种原因,我无法编辑gridview绑定的类,因此我需要使用jQuery将gridview中的标签文本更改为&#34; Message&#34;在加载时从JSON对象调用的值,其中JSON对象中的Key(&#34; 00&#34;,&#34; 01&#34;)与嵌套在标签旁边的隐藏字段的值匹配。隐藏字段值在代码隐藏中与RowDataBound事件上的gridview的其余部分一起设置。这里&#39;到目前为止jQuery / Ajax ..

&#13;
&#13;
    <script language="javascript" type="text/javascript">
        window.onload = function () {
            var accountNumber = "123456";
            $.ajax({
                type: "POST",
                contentType: "application/json",
                url: "Http://MyURL",
                data: accountNumber,
                success: function (data) {
                    //Some Code Here
                }
            });
        };
    </script>
&#13;
&#13;
&#13;

我在这里有点失落。任何建议都表示赞赏。

1 个答案:

答案 0 :(得分:0)

我们已经解决了

我们首先设置标签对象的CssClass,而不是隐藏字段的值,以匹配RowDataBound事件后面代码中JSON对象的键值。然后通过JQuery查找span和类来设置label.text值:

$.ajax({
	type: "POST",
	contentType: "application/json",
	url: "http://MyURL",
	data: accountNumber,
	success: function (data) {  
		if (data) {
			var parseData = JSON.parse(data)
			var table = $('.grid3');
			if (table !== null && table !== undefined) {
				$.each(parseData, function (key, val) {
                                var labelObject = table.find('span[class="' + key + "]');
					var message = val.Message;               
					if (labelObject !== null && labelObject !== undefined) {
						labelObject.html(message);
					}
				});
			}
		}
	},

成功!