<%@ Page Title="" Language="C#" MasterPageFile="~/DefaultMaster.master" AutoEventWireup="true" CodeFile="sqlTest.aspx.cs" Inherits="Sheets_sqlTest_sqlTest" %>

 <%@ Register Assembly="OThinker.H3.WorkSheet" Namespace="OThinker.H3.WorkSheet" TagPrefix="SheetControls" %>

 <asp:Content ID="Content1" ContentPlaceHolderID="cphHead" runat="Server">

 </asp:Content>

 <asp:Content ID="Content2" ContentPlaceHolderID="cphMain" runat="Server">

     <link href="ligerUI/lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />

     <script src="ligerUI/lib/ligerUI/js/core/base.js" type="text/javascript"></script>

     <script src="ligerUI/lib/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script>

     <style>

         .l-grid-detailpanel-inner{

             height:auto !important;

         }

     </style>

     <script type="text/javascript">

         console.log("js从这里开始运行");

         var ajaxurl = 'sqlTest.aspx?Action=GETDATA';

         $.post(ajaxurl, function (datas) {

             console.log("ajax获取成功");

             console.log(JSON.parse(datas));

             //        //调用ligerGrid

             var columns = [

                 { display: '主键', name: 'id', type: 'int', minWidth: , width:  },

                 { display: '名称', name: 'name' },

                 { display: '编号', name: 'number' },

                 { display: '类型', name: 'type' },

                 { display: '单位', name: 'unit' },

                 { display: '单价', name: 'price' },

                 { display: '数量', name: 'quantity' },

                 { display: '备注', name: 'note' }

             ];

             console.log(columns);

             //$(function () {

                 $("#maingrid").ligerGrid({

                     columns: columns,

                     data: JSON.parse(datas),

                     //1，标题：配置title和showTitle:true即可

                     title: '我的表格', showTitle: true,

                     //2，宽度：ligerGrid会根据列自动计算出表格的宽度，当然也可以指定一个数值或者百分比来设置宽度

                     width: '100%',

                     //3，分页：默认是使用分页的，如果不想使用分页，可以配置 usePager :false

                     //usePager :false,

                     //4，滚动条：内容有太多的行时会出现滚动体，如果不想显示，可以通过配置isScroll设置是否出现滚动体

                     isScroll: true,

                     showTitle: false, width: '90%', /*columnWidth: 120,*/

                     detail: { onShowDetail: f_showOrder },

                     onError: function (a, b) {

                     }

                 });

             //});

             //子表数据准备

             var jsonObj = {};

             jsonObj.Rows = [

                 { id: , cpu: "I3", disk: "500G", graphicscard: "2G", memory: "4G" },

                 { id: , cpu: "I5", disk: "500G", graphicscard: "2G", memory: "4G" },

                 { id: , cpu: "I7", disk: "1T", graphicscard: "4G", memory: "8G" },

                 { id: , cpu: "I3", disk: "500G", graphicscard: "2G", memory: "4G" },

                 { id: , cpu: "I5", disk: "500G", graphicscard: "2G", memory: "4G" },

                 { id: , cpu: "I7", disk: "1T", graphicscard: "4G", memory: "8G" },

             ];

             //子表

             function f_showOrder(row, detailPanel, callback) {

                 var grid = document.createElement('div');

                 $(detailPanel).append(grid);

                 $(grid).css('margin', ).ligerGrid({

                     columns: [

                                 { display: 'CPU', name: 'cpu' },

                                 { display: '硬盘', name: 'disk' },

                                 { display: '显卡', name: 'graphicscard'},

                                 { display: '内存', name: 'memory' }

                     ], isScroll: false, showToggleColBtn: false, width: '90%',

                     data: f_getOrdersData(row.id), showTitle: false, columnWidth: ,

                      onAfterShowData: callback, frozen: false

                 });

             }

             //子表数据验证

             function f_getOrdersData(id) {

                 var data = { Rows: [] };

                 for (var i = ; i < jsonObj.Rows.length; i++) {

                     if (jsonObj.Rows[i].id == id)

                         data.Rows.push(jsonObj.Rows[i]);

                 }

                 return data;

             }

         });

     </script>

     <div style="height: 800px;">

         <div id="maingrid"></div>

     </div>

 </asp:Content>

 using OThinker.H3.Portal;

 using System;

 using System.Collections;

 using System.Collections.Generic;

 using System.Data;

 using System.Linq;

 using System.Web;

 using System.Web.Script.Serialization;

 using System.Web.UI;

 using System.Web.UI.WebControls;

 public partial class Sheets_sqlTest_sqlTest : PortalPage

 {

     protected void Page_Load(object sender, EventArgs e)

     {

         DoAction();

     }

     public void DoAction()

     {

         string actionCode = Request.QueryString["Action"] ?? "";

         if (actionCode.ToUpperInvariant()=="GETDATA")

         {

             object jsonObj = null;

             jsonObj = GetSupplies();

             if (jsonObj != null)

             {

                 object n= new JavaScriptSerializer().Serialize(jsonObj);

                 Response.Write(n);

                 Response.End();

             }

         }

     }

     private object GetSupplies()

     {

         DataTable dt = new DataTable();

         string strsql = "select * from M_supplies ;";

         dt = OThinker.H3.WorkSheet.AppUtility.Engine.EngineConfig.CommandFactory.CreateCommand().ExecuteDataTable(string.Format(strsql));

         List<Dictionary<string, object>> lists = new List<Dictionary<string, object>>();

         foreach (DataRow dr in dt.Rows)

         {

             Dictionary<string, object> list = new Dictionary<string, object>();

             list.Add("id", dr["id"].ToString());

             list.Add("name", dr["name"].ToString());

             list.Add("number", dr["number"].ToString());

             list.Add("type", dr["type"].ToString());

             list.Add("unit", dr["unit"].ToString());

             list.Add("price", dr["price"].ToString());

             list.Add("quantity", dr["quantity"].ToString());

             list.Add("note", dr["note"].ToString());

             lists.Add(list);

         }

         var gridData = new { Rows = lists };

         return gridData;

     }

 }