关于ext.gridpane 位置问题

0 0

关于ext.gridpane 位置问题10

Ext.QuickTips.init();

    var fm = Ext.form;
	var sm = new Ext.grid.CheckboxSelectionModel({handleMouseDown: Ext.emptyFn});

    var cm = new Ext.grid.ColumnModel([
		sm,{
			header: '门店号',
			dataIndex:'code',
			//width:80,
			editor: new fm.TextField({
				allowBlank: false
			})
		},{
			header: '门店描述',
			dataIndex: 'name',
			//width:150,
			editor: new fm.TextField({
				allowBlank: false
			})
        }
    ]);

    cm.defaultSortable = true;

    var Member = Ext.data.Record.create([
           {name: 'code', type: 'string'},
           {name: 'name', type: 'string'}
      ]);

	var store = new Ext.data.JsonStore({
		url:'../posShopManager.do',
		baseParams:{command:'query'},
		totalProperty:'count',
		root:'members',
		fields:Member,
		pruneModifiedRecords:true,
		sortInfo: {field: "code", direction: "ASC"} //设置默认排序规则, EditorGridPanel在新增加一行却未保存时如果点击header排序会出现'行142字符6983,modified为空或不是对象'
	});

	//表单窗体
	var memberAddWindow;

    var grid = new Ext.grid.EditorGridPanel({
        store: store,
        cm: cm,
        renderTo: 'member_grid',
        resizeable:true,
        //width:600,
        //height:480,        
        autoHeight:true,			//自动高度 
        autoExpandColumn:2,			//将指定列自动填充剩余部分
        title:'门店管理',
        frame:true,
        clicksToEdit:1,
		sm:sm,
		iconCls:'icon-grid',
		loadMask: true,
		stripeRows:true,
		tbar:[
		{// 添加按钮
			text:'添加',
			iconCls:'user_add',
			handler:function(){
				var m = new Member({
					code:'default',
					name:'new_shop'
				});
				grid.stopEditing();
				store.insert(0, m);
				grid.startEditing(0, 2);
				store.getAt(0).dirty=true; // 设置该行记录为脏数据(默认为非脏数据),否则在保存时将无法判断该行是否已修改
			}
		},'-',{//删除按钮
			id:'btnDelete',
			text:'删除',
			iconCls:'user_delete',
			handler:function(){
				var sm = grid.getSelectionModel();
				var selected = sm.getSelections();
				var ids = [];
				for(var i=0;i<selected.length;i+=1){
					var member = selected[i].data;
					if(member.code) {
						ids.push(member.code); //如果有ID属性,则表示该行数据是被修改过的,所以需要访问数据库进行删除
					}else{
						//如果没有ID属性,则表示该行数据是新添加的未保存的数据,所以不需要访问数据库进行删除该行
						store.remove(store.getAt(i));
					}
				}
				if(ids.join('')==='') 
				{
					return;
				}
				
				Ext.Msg.confirm('信息','确定要删除所选项吗?',function(btn){
					if(btn=='yes'){
						//发送删除请求
						Ext.lib.Ajax.request(
							'POST',
							'posShopManager.do',{
								success:function(request){
									var message = request.responseText;
									Ext.Msg.alert('信息',message);
									store.reload();
								},failure:function(){
									Ext.Msg.alert('错误','删除时出现未知错误.');
								}
							},
							'command=delete&ids='+ids
						);
					}
				});
			}
		},'-',{//保存按钮
			text:'保存',
			iconCls:'save',
			handler:function(){
				var json = [];
				for(i=0,cnt=store.getCount();i<cnt;i+=1){
					var record = store.getAt(i);
					if(record.dirty) // 得到所有修改过的数据
					{
						json.push(record.data);
					}
				}
				if(json.length==0){
					Ext.Msg.alert('信息','没有对数据进行任何更改');
					return;
				}
				
				//发送保存请求
				Ext.lib.Ajax.request(
					'POST',
					'posShopManager.do',{
						success:function(request){
							var message = request.responseText;
							Ext.Msg.alert('信息',message);
							store.reload();
							//grid.getView().refresh();
						},
						failure:function(){
							Ext.Msg.alert("错误", "与后台联系的时候出现了问题");
						}
					},
					'command=save&members='+encodeURIComponent(Ext.encode(json))
				);
			}




		}

为什么我生成的表格其中的增加/删除/保存的按钮不是靠左的它们居中而且 ColumnModel 中的 header 都不显示。这样排序和名称都看不到。不知道怎么贴图。要不就看效果了