extjs 里, 行编辑是单独的 div 浮动在 grid 上面的, 避免了每行editor 的 remove/append/appendTo 操作

datagrid 翻页后, rownumber 还是从1开始计数显示,
而 pagination 区却显示: 显示31到60,共119记录, 两者的内容感觉不匹配

建议 easyui 的 rownumber 在翻页后, 与 pagination 区保持一致, 如: 从 31 开始编号.

如果 combobox 内容较多, 超出屏幕下方,  easyui 会尝试向上弹出.
这时候进行拼音 filter 过滤, combobox 内容过滤后数量变少, 又跳到下方显示.

处理 combobox 过滤时, 如果 combobox 的 panel 已经显示, 就不用重新计算位置了.

利用 datagrid 做类似 Excel 的批量编辑模块.
用户每次切换行时, easyui 都是全部重建 editor 控件, 这样导致了性能问题. 在 firefox 里也有明显的卡顿.

Live demo 里的 Cache Editor for DataGrid, editor 确实复用了, 但是性能似乎没有改善...
找了一些 extjs 的官方例子, 感觉性能还不错, 不知是否有借鉴意义.

extjs 里的行编辑功能
http://dev.sencha.com/extjs/5.0.0/examples/kitchensink/#binding-chained-stores

extjs 里的 cell 编辑, 支持 tab 键跳转, 非常方便
http://dev.sencha.com/extjs/5.0.0/examples/kitchensink/#cell-editing

问题描述:
     datebox控件, 复写formatter, 把选择的日期 2014-03-23 转成 2014-03 或者 2014 格式
     测试发现, 选择日期后, dateFormatter 会调用2次, 第一次传入 2014-03-23, 第2次传入原日期值, 导致值始终都是原来的值.
     似乎跟日期格式有关系, dateFormatter 返回 2014-03 或 2014, 不被 datebox 控件接受?

复写属性
     formatter: function(date){return dateFormatter(el, date);},

函数内容:
     function dateFormatter(el, date){
      var y = date.getFullYear();
      var m = date.getMonth()+1;
      var d = date.getDate();
      
      var mm = m;
      if (mm < 10) mm = "0" + mm;
      var dd = d;
      if (dd < 10) dd = "0" + dd;
      
      var opt = el.combo("options");
      if (opt.mask){
         var value = opt.mask;
         value = value.replace("yyyy", y);
         value = value.replace("MM", mm);
         value = value.replace("dd", dd);
         
         value = value.replace("M", m);
         value = value.replace("d", d);
         return value;
      }
      
      var value = y + "-" + mm + "-" + dd;
      return value;
   }

validate 在输入字符时就会调用, 所以清空的代码不能放在这里.

建议不清空错误的信息, 而是留给用户自己去纠正.

如果非要清空, 可以用:
var tb = $("#cc").combo("textbox");
tb.bind("blur", function(evt){
    ...
});

目前的 datebox 日历控件, 对 yyyy 和 yyyy-MM 格式的信息录入并不方便.
建议在 timespinner 的基础上, 增加 datespinner 控件, 谢谢.

补充:
v1.4 已经增加 datetimespinner

如下定义 datagrid , 把主键列定义两次, 一个用于显示checkbox, 另一个用于显示值:
"frozenColumns":[[
{"field":"timezoneId","title":"ID","checkbox":true},
{"field":"timezoneId","title":"ID"}]],
"idField":"timezoneId"
]]

但是会出现2个checkbox列.

我该如何实现即生成checkbox, 又能把主键值显示出来?
因为有些表的主键是手工赋值的, 不是UUID, 有业务逻辑意义, 用户希望能够看到内容.

 Datagrid row filter 不支持 datetimebox, timespinner, numberbox 等控件吗?

defaultFilterType , 我想先创建成 text , 然后用代码转换成combobox (中间有复杂的逻辑处理)
虽然能够转换, 但是转换后的控件无法随 datagrid 的列宽自动调整,
请问有什么办法解决?

demo 里的 easyui.css 包含下面的css, 但是发布的版本里没有, 导致普通的 text 控件没有边框, 很难看.

.datagrid-view .datagrid-editable-input {
  margin: 0;
  padding: 2px 4px;
  border: 1px solid #95B8E7;
  font-size: 12px;
  outline-style: none;
  -moz-border-radius: 0 0 0 0;
  -webkit-border-radius: 0 0 0 0;
  border-radius: 0 0 0 0;
}

建议 easyui 把普通的 text 控件也封装, 使边框外观与combo控件保持一致

目前是输入日期时, 下拉框自动弹出.
按回车时, 自动把当前日期赋值到 input 框里.

我们要实现的功能是日期控件用于查询条件,
用户可以选择一个日期, 回车查询,
也可以输入查询模式  >2014-01-01 , 回车查询,

但是一回车, 日期就变成当前日期了, 如何关闭datebox默认的键盘事件呢?



好吧, 我们还是自己解决了

   $.extend($.fn.datebox.defaults.keyHandler, {
      query:function(e){
         // 录入时关闭panel
         var el = $(this);
         el.combo('hidePanel');
      },
      enter:function(e){
                        // 回车时关闭panel
         var el = $(this);
         // 必须强制赋值, 否则后面 getValue 有可能是旧值
         var t = el.combo("textbox");
         el.combo("setValue", t.val());
         el.combo('hidePanel');
      }
   });

   <div class="easyui-layout" style="fit:true;">

   </div>

        <!-- 以下内容是点击按钮弹出全屏窗口, 但是在有 layout 的情况下, 不能随页面缩放 -->
   <div class="easyui-window" title="Basic Window"   data-options="fit:true" >
      The window content.
   </div>

tab控件的标签页在left时, 必须加上 class="easyui-tabs", 否则tab内容不显示

<div id="tt" class="easyui-tabs" >
   <div title="About" style="padding:10px">
      123
   </div>
   <div title="My Documents" style="padding:10px">
      abc
   </div>
</div>
   
<script>
   // 想在这里动态转为 tab
   $("#tt").tabs({
      tabPosition:'left',
      height:250
   });
</script>

新建的 datagrid, 没有加载数据时, pagination 显示为: 显示1到1,共1记录
这是不合理的, 没数据怎么来的1呢?

建议把默认值改成 0.

另外, 如何区分 datagrid 新建时没有检索数据和检索不到数据的情况.
这2种情况都是 total 为0, 建议专门增加一个检索不到数据的提示属性

dg.datagrid('loadData', data);  // 如果此时 total 为0, 则显示: 没有检索到数据