使用javascript将JSON对象绑定到asp.net gridview控件

Bind JSON object to asp.net gridview control using javascript

本文关键字：asp net gridview 控件 绑定 javascript JSON 对象 使用      更新时间：2023-09-26

我的jquery ajax调用了我的代码编写静态WebMethod，我使用System.Web.Script.Serialization.JavaScriptSerializer来获取JSON对象，输出如下。

[{"ProductId":"9","Category":"TV","Products":"Discovery","Price":15.97},{"ProductId":"25","Category":"TV","Products":"HBO","Price":15.97}]

我有GridView（asp.net控件），它有ProductId、Category、Products和Price列。我应该使用JavaScript将这个json对象绑定到gridview。

我甚至不知道如何在上面的Json字符串上申请循环。请说明一下。

您可以像一样循环使用JSON数据

var data=[{"ProductId":"9","Category":"TV","Products":"Discovery","Price":15.97},
          {"ProductId":"25","Category":"TV","Products":"HBO","Price":15.97}];
$.each(data,function(index,item){
    alert(item.ProductId);
    alert(item.Category);
});

要替换网格，可以为表构建HTML标记并将其注入DOM。

 var itemRow="<table>";  
 $.each(data,function(index,item){
    itemRow+="<tr><td>"+item.ProductId+"</td><td>"+item.Category+"</td></tr>";
 });        
 itemRow+="</table>";  
 $("#divItems").html(itemRow);

工作样品http://jsfiddle.net/qS7uD/6/

但在此之后，您将无法获得ASP.NET网格事件，因为它是用于显示的纯HTML标记

使用默认的asp.net网格无法做到这一点，请为基于json的网格签出jQGrid

要反序列化JSON，您应该创建一个具有相同属性的类，并像这样使用JavascriptSerilzier。

public class Product
{
  public int ProductId{get;set;}
  public string Category{get;set;} 
  public string Products{get;set;} 
  public decimal Price{get;set;}
} 

myProducts List<Product> = new JavaScriptSerializer().Deserialize<List<Project>>(myJson);

然后，您可以使用一个简单的for each循环来循环浏览您的产品列表。您也可以使用列表作为数据源来绑定控件。

相关文章：