如何使用json和sql將數據導入到EXTJS Grid Panel中

Question

我想在extjs中顯示gridview。該數據從sql db收集。我有一個查詢來獲取來自我的GridViewController（）中的SQL數據庫的數據，但我不知道如何將這些數據保存在數組中，然後將其編碼爲JSON並將數據發回。

我gridviewcontroller

public string writeRecord() 
    { 

     Response.Write("Survey Completed!"); 
     SqlConnection conn = DBTools.GetDBConnection("ApplicationServices2"); 


     string sqlquery = "SELECT Q1, Q2, Q3, Q4, Improvements, Comments FROM myTable"; 
     SqlDataAdapter cmd = new SqlDataAdapter(sqlquery, conn); 

     DataSet myData = new DataSet(); 
     cmd.Fill(myData, "myTable"); 

     JavaScriptSerializer jss = new JavaScriptSerializer(); 
     string json = jss.Serialize(myData); 

     conn.Open(); 
     conn.Close(); 
     return "{rows: '+ json +'}"; 

    } 

，這是我gridviewApp.js。這是我創建gridview並嘗試從我的gridviewController獲取數據的地方。

var store = Ext.create('Ext.data.JsonStore', { 


     storeId: 'myData', 
     reader: new Ext.data.JsonReader({ 
      fields:[ 
      { name: 'Q1', type: 'int' }, 
      { name: 'Q2', type: 'int' }, 
      { name: 'Q3', type: 'int' }, 
      { name: 'Q4', type: 'int' }, 
      { name: 'Q5', type: 'int' }, 
      { name: 'Improvements', type: 'string' }, 
      { name: 'Comments', type: 'string'}] 
      }), 

      proxy: { 
      type: 'json', 
      url: 'GridView/writeRecord' 
      } 

    }); 
    this.grid = Ext.create('Ext.grid.Panel', { 
     title: 'GridView App', 
     url: 'GridView/writeRecord', 
     //store: store, 
     store: Ext.data.StoreManager.lookup('myData'), 
     columns: [ 
     {header: 'Q1', width: 100, 
     sortable: true, dataIndex: 'Q1'}, 
     { header: 'Q2', width: 100, 
      sortable: true, dataIndex: 'Q2' 
     }, 
     { header: 'Q3', width: 100, 
      sortable: true, dataIndex: 'Q3' 
     }, 
     { header: 'Q4', width: 100, 
      sortable: true, dataIndex: 'Q4' 
     }, 
     { header: 'Improvements', width: 200, 
      sortable: true, dataIndex: 'Improvements' 
     }, 
     { header: 'Comments', width: 200, 
      sortable: true, dataIndex: 'Comments' 
     } 
    ], 
     stripeRows: true, 
     //height:250, 
     width: 800, 
     renderTo: Ext.getBody() 
    }); 

任何一種建議或投入將高度讚賞...謝謝

更新球員：

我得到這個錯誤 在序列化對象時檢測到循環引用類型爲「System.Globalization.CultureInfo」。

當我使用

return Json(myData, JsonRequestBehavior.AllowGet); 

但是我能夠從我的分貝導致當我使用

myData.GetXml(); 

而且這裏的另一個棘手的部分。 我可以使用像

http://localhost:55099/GridView/writeRecord 

直接路徑只能訪問我的分貝的結果，但我gridView.js仍然顯示空白......任何見解？

Answer 1

我會使用MVC的內置JSON中的功能是這樣的：

public ActionResult ActionName() 
    { 

     DataSet ds = new DataSet(); 

     // populate ds 

     return Json(ds, JsonRequestBehavior.AllowGet); 

    } 

這將確保您的JSON格式正確出來。

編輯

你的功能應該是這樣的：

public ActionResult writeRecord() 
    { 

     Response.Write("Survey Completed!"); 
     SqlConnection conn = DBTools.GetDBConnection("ApplicationServices2"); 


     string sqlquery = "SELECT Q1, Q2, Q3, Q4, Improvements, Comments FROM myTable"; 
     SqlDataAdapter cmd = new SqlDataAdapter(sqlquery, conn); 

     DataSet myData = new DataSet(); 
     cmd.Fill(myData, "myTable"); 


     conn.Open(); 
     conn.Close(); 

     return Json(myData, JsonRequestBehaviour.AllowGet); 

    }