子雨轩网络

ExtJS下grid的一些属性说明 1.界面修改(css style)：
Extjs中界面风格与我们产品本身的风格有很大不同，从边框、选中行的颜色到鼠标移动到的行的颜色、菜单等，几乎都不同。Extjs对这些样式的设置都是由css完成的。如：
选中行的颜色就可用如下设置完成：
.x-grid3-row-selected{background:#c6e2ff!important;}
其他的都类似，只要找到对应的class, 然后设置要修改的部分即可。
2. 属性的作用(About Ext.grid. GroupingView, EditorGridPanel):
Extjs的grid功能强大，如排序、隐藏列或移动列等，这些都有一些属性与其对应，可以选择要还是不要。其中一些的属性和其作用如下：
*. EditorGridPanel:
border: false, //grid的边界
autoHeight: true, //grid的高度是否要用指定的高度
enableColumnMove: false, //grid的列是否可以移动
enableHdMenu: false, //在列的header是否要有下拉菜单
trackMouseOver: true, //当鼠标移过行时，行是否要highlight
stripeRows: [...]

       这两天一直苦于没有一个完整的EXTJS，Gridpanel的PHP完整实例，加上官方英文资源和不完整的实例，相信一个新手一定会遇到一些麻烦。这不，弄了我一两天。现在贴上我的完整代码。
第一步：存储数据
记得要用store.load();方法
store.load({params:{start: 0, limit: 8}});
第二步gridpanel 部分

 
第三部分，PHP服务器端，为了简化我没有用数据库，用PHP模拟了一些数据，代码在下面。

 
一些总结我在开发中遇到的问题，第一在gridpanel里边store:store不能去掉的。
第二({params:{start: 0, limit: 8}});里边参数是每次会自动发送的，所以服务器端要用这两个名字来取。
不多说还是看代码方便吧。下载

出于用户体验的考虑，我的项目中要做到在第一个选完之后第二个不用点击日历图标而自动display(展开)Datapicker(就是那个日历)，因为要做到这一步思路是先在每一个DateField触发一个事件然后用一个方法display第二个DateField。这个方法是什么呢？由于对extjs还算初学者再加上英文的资料有一些吃力所以弄了半天也没有搞定。
我的开始的代码是：
items:[
[
new Ext.form.DateField({
fieldLabel: '请选择开始时间',
id:'btn_history_more_startdate',
name: 'btn_history_more_startdate',
format: 'Y-m-d',
width: 100,
allowBlank: false,
readOnly:true,
listeners:{'select':function(){
}}
})
],[
new Ext.form.DateField({
fieldLabel: '请选择结束时间',
id:'btn_history_more_enddate',
name: 'btn_history_more_enddate',
format: 'Y-m-d',
width: 100,
allowBlank: false,
readOnly:true,
listeners:{'change':function(){
}}
})
]
]
Ext.getCmp(”第二个日历的ID’).onTriggerClick;
原因是我在查表时对于onTriggerClick方法有这样的描述
/**
     * @method onTriggerClick
     * @hide
     */
    // private
    // Implements the default empty TriggerField.onTriggerClick function to display the DatePicker

最后一试问题解决，大喜。。。。