dhtmlx之dhtmlXGrid显示数据

   引用

    <link href="../../dhtmlXGridScripts/dhtmlxgrid.css" rel="stylesheet" type="text/css" />
    <link href="../../dhtmlXGridScripts/dhtmlxgrid_skins.css" rel="stylesheet" type="text/css" />
    <script src="../../dhtmlXGridScripts/dhtmlxcommon.js" type="text/javascript"></script>
    <script src="../../dhtmlXGridScripts/dhtmlxgrid.js" type="text/javascript"></script>
    <script src="../../dhtmlXGridScripts/dhtmlxgridcell.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-1.4.4.js" type="text/javascript"></script>
   <script> window.dhx_globalImgPath = "../../dhtmlxComboScripts/imgs/"; </script>

 

 <div id="gridbox1" style=" height:100%; width:300px"></div>

 

js

 <script type="text/jscript">
        var mygrid; // 定义mygrid
        $(function () {
            mygrid = new dhtmlXGridObject('gridbox1');
            mygrid.enableAutoWidth(true); // 自动宽度         
            mygrid.setHeader("标题一,标题二,标题三"); // 设置grid的头
            mygrid.setInitWidths("150,150,150")
            mygrid.setColTypes("ro,ro,ro");
            mygrid.setColAlign("center,center,center");
            mygrid.setColSorting("str,str,str");
            mygrid.setEditable(true);
            mygrid.setSkin("dhx_skyblue");  //dhtmlXGrid默认加载为XML。
            mygrid.init(); // 初始化
            mygridjiazai(); // 调用方法,加载数据(数据库查询)
        });

        function mygridjiazai(){
            $.ajax({
                type: "POST",
                url: "/Main/GetDemoData",
                cache: false,
                success: function (result) {
                    $.each(result, function (i, item) {
                        var str = item.ID + "," + item.Name + "," + item.Content;  // 将hosnum,nodecode,localip保存在rowid里
                        mygrid.addRow(str, [
                item.ID,
                item.Name,
                item.Content
            ]);
                 
                    });
                }
            });
     }

 

Controller

public ActionResult GetDemoData()
        {
            ArrayList jsonList = new ArrayList();
            foreach (DataRow dr in Demo.DemoData().Rows)
            {
                Dictionary<string, Object> item = new Dictionary<string, Object>();
                item.Add("ID", dr["ID"]);
                item.Add("Name", dr["Name"]);
                item.Add("Content", dr["Content"]);
                jsonList.Add(item);
            }

            return Json(jsonList, JsonRequestBehavior.AllowGet);
        }

你可能感兴趣的:(html)