Fri Apr 26 2019 00:00:00 GMT+0000 (Coordinated Universal Time)
fieldcontainer使用
一直没有实现的布局样式，即文本输入框，跟按钮在一行内的布局，终于实现了。fieldcontainer有fieldLabel属性，属于整行的标签，这样整体布局不会乱。具体如下：
{
xtype: 'fieldcontainer',
layout: "hbox",
//1 注意下面，标签放在1位置跟2位置有很大的差别。
fieldLabel: '责任医生',
items: [{
xtype: 'textfield',
//2 这个标签就不用了。
flex: 1,
name: 'Doctor_Name'
}, {
xtype: "button",
text: "添加",
margin: '0 0 0 10',
handler: function () {
// me.priceProductWindow.show();
},
width: 100,
}]
}另外，见别人这样写，利用panel作为容器，严格控制各个宽度，也能达到效果。代码如下：
{
xtype:"panel",
layout:"hbox",
height:30,
border:0,
items:[{
width:363,
xtype:'textfield',
labelWidth:70,
editable:false,
fieldLabel: SHINEECALL_PATIENT_PATIENTINFO_PATIENTFORM_PATIENT_DOCTOR,
labelAlign:"right",
name: 'Doctor_Name'
},{
xtype:"button",
text:SHINEECALL_PATIENT_PATIENTINFO_PATIENTFORM_SELECT_DOCTOR,
style:{
'margin-left':"10px",
width:"90px"
},
handler:function(){
}
}]
}行编辑器中难排查的bug
一般来说store中的fields可以不写。但是在行编辑器中，store的fields字段必须要填。否则，context.record始终没有任何变化。而且还很难排查。
store:{
//行编辑器中的fields必须要填
fields:[
{name: 'Grade_ID',type: 'int'},
{name: 'Grade_Name',type: 'string'},
{name: 'Grade_Color',type: 'string'},
{name: 'Grade_Background',type: 'string'}
],
//否则下面的context，context.record始终没有变化，而且也没有触发验证
//记录上也没有红点。
listeners:{
"edit":function(editor, context, eOpts){
var me=this;
//点击保存触发ajax请求
var record =context.record;
console.log(record['data']);
表格渲染效果
一般常用renderer来进行数据的转换展示，比如，将1、2转换成男、女展示。但此函数还有很强大的功能，比如更改展示的效果，在renderer返回值中，添加要插入的图标，一并插入的展示中。下面两个示例。
- 结果转换，记得，这个转换好像会污染到变量。
renderer:function(v){
//下面的这个m也能使用全局或者类成员的属性，或者
//通过ajax从后台获取，完成 一对多的 联表效果（但是性能嘛，不高。）
var m={1:'男',2:'女'};
return m[v];
},- 这个是通过返回值来进行更改效果。
{
text: "字体颜色",
width:100,
sortable: false,
dataIndex: 'Grade_Color',
editor: {
allowBlank: false//要求数据不能为空。
},
//这个是通过返回值来进行更改效果。
renderer:function(v){
var m = '<div style="background:'+v+'">'+v+'</div>';
return m;
}
},- 通过metaData更改效果。 metaDa.tdCls 指定类名、metaData.tdStyle写css样式(能批量)、metaData.tdAttr指定一个属性（不能批量）。下面使用了两种方式：
{
text: "背景颜色",
width:100,
sortable: false,
dataIndex: 'Grade_Background',
editor: {
allowBlank: false//要求数据不能为空。
},
renderer:function(v,metaData){
//注意，下面是使用了 等号=
//这种只更改一种属性，写法比较简单。
metaData.tdAttr = 'bgcolor="' + v + '"';
return v;
}
},
{
text: "预览",
width:100,
sortable: false,
dataIndex: 'Grade_Background',
//metaData.tdStyle 可以直接写css，记得使用冒号:分隔，另外
//background-color不能写成backgroundColor,这个地方不会进行转换。
renderer:function(v,metaData,record){
var color=record.get('Grade_Color');
metaData.tdStyle='background-color:'+ v +';color:'+color+';';
return '示例效果';
}
},dataview 选择功能
在查看dataview的帮助时，发现其有selectionModel这个属性。既然有这个属性，就想设置一些选择特性。但是遗憾的是，没有成功。虽然，用dataview的getSelection()、getSelectionModel()来获取，选择模型确实生效了，但是效果却没有。而且测试时，dataview的并未添加任何listeners事件。我猜测，可能跟选择模型有关，这个选择模型，可能没有这个功能。测试使用了其他的选择模型，没有报错，但是一样没有效果。
beforeselect方法，在选择边框的时候，也并不能触发。
看来还是只能使用以前的土方法呢。（之前记载过这个方法，即桌面版选择会议室功能）
由此，应该关注SelectionModel的使用方法。类的继承关系。
selectionModel:{
type: 'dataviewmodel',
allowDeselect:false,
mode : "MULTI" ,
toggleOnClick:true
}
但是，改进了dataview的保持选择一个的功能，可以不用引入一个变量保存上次选择的。直接用lastSelected
xtype:"dataview",
listeners:{
'selectionchange':function(cmp, selected, eOpts ){//只选择一个。
var selModel=this.getSelectionModel();
if(selected.length===0){//没有选择项，则不能取消
if(selModel.lastSelected){
selModel.select(selModel.lastSelected);
}
}
},
},select 不要触发事件
第一次选择的时候，不希望触发select事件，之前想到过，使用一个标志位进行标记，但突然想到，框架里面好像有忽略触发消息的功能。然后隧完成如下。
如果不加这个参数，在这个颜色选择模块会造成事循环。
selectColor:function(){
var me=this;
var color = me.getValue();
var dv=me.popupWin.down('dataview');
var selRd=null;
dv.store.each(function(rd){//查找选中的record
if(rd.get('color')==color){
selRd=rd;
return false;
}
});
if(selRd){
//这个是初始化的时候，使用的，所以呢，应该忽略触发消息。
dv.getSelectionModel().select(selRd,false,true);
}else{
dv.getSelectionModel().deselectAll(true);
}
}rowedit
对与每个editor而言，生命周期比较长，在rowedit所属的grid的销毁时，才销毁。