easyui中 combogrid控件的loadData方法加载本地数据

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
        <script id="jquery_183" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.3.min.js"></script>
</head>
    <link id="others_jquery_easyui_131" rel="stylesheet" type="text/css" class="library" href="/js/sandbox/jquery-easyui/themes/default/easyui.css">
    <script id="others_jquery_easyui_131" type="text/javascript" class="library" src="/js/sandbox/jquery-easyui/jquery.easyui.min.js"></script>

        <script type="text/javascript">
            $(function () {
                $("#userreg_middle_zcrj_tb").datagrid({
                    width: 450,
                    height: 250,
                    rownumbers: true,
                    columns: [[
                      { field: ‘code‘, title: ‘code‘, width: 100, editor: { type: ‘combobox‘} },
                      { field: ‘name‘, title: ‘name‘, width: 100, editor: { type: ‘combobox‘} },
                      { field: ‘addr‘, title: ‘addr‘, width: 100, editor: { type: ‘text‘} },
                      { field: ‘col4‘, title: ‘‘, width: 50
                      }
                   ]]
                });
                $(‘#cc‘).combogrid({
                    panelWidth: 450,
                    value: ‘name‘,
                    idField: ‘code‘,
                    textField: ‘name‘,
                    columns: [[{ field: ‘code‘, title: ‘Code‘, width: 60 },
                       { field: ‘name‘, title: ‘Name‘, width: 100 },
                       { field: ‘addr‘, title: ‘Address‘, width: 120 },
                       { field: ‘col4‘, title: ‘Col41‘, width: 100}]]
                });
                var a = [{ code: 1, name: ‘aaa‘, addr: ‘aasdf‘, col4: ‘asdfasdfasdf‘ },
                { code: 1, name: ‘aaa‘, addr: ‘aasdf‘, col4: ‘asdfasdfasdf‘ },
                { code: 1, name: ‘aaa‘, addr: ‘aasdf‘, col4: ‘asdfasdfasdf‘}];
                //  var b = $.parseJSON(a);
                $("#userreg_middle_zcrj_tb").datagrid("loadData", a);
                $("#cc").combogrid("loadData", a);
            });
        </script>

<body>
      <table id="userreg_middle_zcrj_tb"></table>
      <input id="cc" name="dept" value="01"/>
</body>
</html>

  最关键是最后两个loadData,在datagrid中加载成功,在combogrid中加载不成功,而在文档中写着:

组合表格

继承$.fn.combo.defaults和$.fn.datagrid.defaults,使用$.fn.combogrid.defaults重载默认值。

事件

事件继承自定义组合框和数据表格。

就想当然的以为loadData呗combogrid继承过来了。然后一直调试抓狂,今天又把combogrid的文档看了一遍,有这样的一个方法

grid 	none 	返回数据表格对象。

  

突然就豁然开朗了。

只需要把上面的修改成:

  $("#cc").combogrid("grid").datagrid("loadData", a);

就解决了

这件事情不熟悉api导致浪费了两天的时间,这个教训告诉我,对于不熟悉的东西要多在文档上找解决方法,包括前几天datagrid编辑的问题,在官方的文档里直接有两个相关的例子。要重视官方文档啊。

时间: 2024-10-06 09:29:03

easyui中 combogrid控件的loadData方法加载本地数据的相关文章

easyui 中Datagrid 控件在列较多且无数据时,列显示不全的解决方案

在onLoadSuccess 中加入如下代码就OK啦 $('#dg3').datagrid({ onLoadSuccess:function(data){ if(data.total==0){ var dc = $(this).data('datagrid').dc; var header2Row = dc.header2.find('tr.datagrid-header-row'); dc.body2.find('table').append(header2Row.clone().css({"

设定当前视图中所有控件字体的方法

     本范例实现的是对界面中所有的控件一次性的设置字体样式.思路是找到父控件,然后遍历子控件.如果子控件是可以修改文字的控件,那么就设置文字.这用到了控件的继承,很多控件都是继承与textview的,所以将控件均转为textview,最后设置字体即可. 布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.

EasyUI 中 DataGrid 控件 列 如何绑定对象中的属性

EasyUI 中 DataGrid 控件 是我们经常用到的控件之一, 但是 DataGrid 控件 在绑定显示列时却不支持对象属性绑定. 模型如下: public class Manager implements java.io.Serializable { private Integer id; private Role role; private String loginName; private String password; private int status; private Da

获取屏幕高宽,在代码中设置控件大小的方法

获取屏幕高宽的方法: 1 import android.view.Display; 2 import android.view.WindowManager; 3 WindowManager windowManager = getWindowManager(); 4 Display display = windowManager.getDefaultDisplay(); 5 if(display.getWidth()==480 && display.getHeight()== 272 ||

在cocos2d-x中CCTableView控件的使用方法

头文件需要继承CCTableViewDataSource和CCTableViewDelegate //CCScrollViewDelegate virtual void scrollViewDidScroll(CCScrollView* view){}; virtual void scrollViewDidZoom(CCScrollView* view){}; //CCTableViewDelegate virtual void tableCellTouched(CCTableView* tab

背水一战 Windows 10 (64) - 控件(WebView): 加载指定 HttpMethod 的请求, 自定义请求的 http header, app 与 js 的交互

[源码下载] 作者:webabcd 介绍背水一战 Windows 10 之 控件(WebView) 加载指定 HttpMethod 的请求 自定义请求的 http header app 与 js 的交互 示例1.演示 WebView 如何加载指定 HttpMethod 的请求以及如何自定义请求的 http headerWebApi/Controllers/WebViewPostController.cs /* * 用于 WebView 演示“如何加载指定 HttpMethod 的请求,以及如何自

控件WebView网页的加载

Android:控件WebView网页的加载 WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient setWebClient:主要处理解析,渲染网页等浏览器做的事情 setWebChromeClient:辅助WebView处理Javascript的对话框,网站图标,网站title,加载进度等 WebViewClient就是帮助WebView处理各种通知.请求事件的. 1.在Andr

使用ajax()方法加载服务器数据

使用ajax()方法加载服务器数据 使用ajax()方法是最底层.功能最强大的请求服务器数据的方法,它不仅可以获取服务器返回的数据,还能向服务器发送请求并传递数值,它的调用格式如下: jQuery.ajax([settings])或$.ajax([settings]) 其中参数settings为发送ajax请求时的配置对象,在该对象中,url表示服务器请求的路径,data为请求时传递的数据,dataType为服务器返回的数据类型,success为请求成功的执行的回调函数,type为发送数据请求的

通过在jquery中添加函数发送ajax请求来加载数据库数据,以json的格式发送到页面

通过在jquery中添加函数发送ajax请求来加载数据库数据,以json的格式发送到页面 从数据库中查询仓库信息,显示在下拉菜单中: 首先,引入js插件,这里使用jquery-1.8.3.js <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script> 当页面加载完成后,就应该发送ajax请求到数据库,