Extjs在form展示後台單個對象的屬性

標籤：.sh   mat   ret   amount   ring   tab   json   win   服務   

目的:寫一個按鈕事件,點擊時彈出一個win表單,裡面鑲嵌form表單,並且展示後台單個對象的屬性

1 先來後台:2 public void find(){3         String clientId = request.getParameter("clientId");4         BusinessContract bc = businessContractService.getLastContract(clientId);5         response.setContentType("text/html;charset=UTF-8");6         JSONObject json = JSONObject.fromObject(bc);7         ajaxWrite("{bc:["+json.toString()+"]}");8     }

前台代碼:    win 和form放在一起text:‘客戶合約上傳‘,            scope:this,            handler: function(item, event){                var record=this.getSelectionModel().getSelected();                if(!record){                    Ext.MessageBox.alert(‘提示‘, ‘請選擇客戶資訊!‘);                    return;                }                var clientId=record.id;                var adr = ‘************‘;  //form表單提交路徑                var findadr="*****************";//form表單資料來源                var company =record.data.bi_name;//來源於選中行的資料                var uploadForm=new Ext.form.FormPanel({//按照順序,先建立一個form表單                    width:600,                    baseCls: ‘x-plain‘,                    frame:true,                    layout: ‘form‘,                    fileUpload: true,//檔案上傳必須添加該屬性,(PS:此處出現問題,添加該屬性之後傳回值裡action.result為空白,去掉則正常,暫時沒解決)                    autoHeight:true,                    labelWidth:90,                    defaults:{                        anchor: ‘95%‘,                          allowBlank: false                      },                    renderTo: Ext.getBody(),                    reader: new Ext.data.JsonReader({//此處動態載入資料的屬性擷取                        root: ‘bc‘　　//取值對象                        },                        [　　　　//對象裡面的欄位
　　　　　　　　　　　　　　‘contractType‘,                        ‘companyAddress‘,‘companyName‘,‘companyPhone‘,‘taxNum‘,‘bankName‘,                        ‘bankNum‘,‘financer‘,                        {name:‘taxpayerFile1‘,convert :function(v,record){　　//這裡是上傳檔案的路徑,本來是伺服器路徑,這裡就不予展示,直接提示是否上傳過                            if(v){                                return ‘已經上傳‘;                             }else{                                return ‘暫無檔案‘;                            };                         }},                         {name:‘taxpayerFile2‘,convert :function(v,record){                             if(v){                                    return ‘已經上傳‘;                                 }else{                                    return ‘暫無檔案‘;                                };                          }},{name:‘docmentFile‘,convert:function(v,record){
　　　　　　　　　　　　　　　　　　　if(v){　　　　　　
　　　　　　　　　　　　　　　　　　　　return ‘已經上傳‘; 

                                }else{                                    return ‘暫無檔案‘;                                };}

　　　　　　　　　　　　　　　　},

                        {name:‘sdate‘,type:"date",mapping:‘sdate.time‘,convert :function(v,record){　　//日期欄位,此處接受的欄位格式:"edate":{"date":9,"day":5,"hours":0,"minutes":0,"month":5,"nanos":0,"seconds":0,"time":149693　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　//　7600000,"timezoneOffset":-480,"year":117}   所以只能對格式加以控制                             return  Ext.util.Format.date(new Date(v),‘Y-m-d‘);                         }},                            {name:‘edate‘,type:"date",mapping:‘edate.time‘,convert :function(v,record){                             return  Ext.util.Format.date(new Date(v),‘Y-m-d‘);                         }},                        ‘paymentDays‘                        ,‘amount‘,‘saler‘,‘content‘                        ]),                     items:[{                            fieldLabel:‘當前客戶‘,                            xtype : ‘tbtext‘,                            text:‘<b>‘+company+‘</b>‘,                            valueField :clientId,                            name :‘compnay‘                        },{                            fieldLabel:‘合約類型‘,                            xtype:‘attrCombo‘,                            displayField:‘name‘,                            valueField :‘name‘,                            editable:false,                            url:‘/cs/customer/cct_find.ftl‘,                            name:‘contractType‘                        },{                             name:‘companyName‘,                             xtype:‘textfield‘,                             allowBlank:false,                             fieldLabel: ‘甲方全稱*‘                         },{                             name:‘companyAddress‘,                             xtype:‘textfield‘,                             fieldLabel: ‘甲方地址‘,                             allowBlank:true,                         },{                             name:‘companyPhone‘,                             xtype:‘textfield‘,                             allowBlank:true,                             fieldLabel: ‘甲方電話‘                         },{                             name:‘taxNum‘,                             xtype:‘textfield‘,                             fieldLabel: ‘甲方稅號‘,                             allowBlank:true,                            regex: /^[\w-]{15}([\w-]{3})?$/                         },{                             name:‘bankName‘,                             xtype:‘textfield‘,                             allowBlank:true,                             fieldLabel: ‘甲方開戶行‘                         },{                             name:‘bankNum‘,                             xtype:‘textfield‘,                             allowBlank:true,                             fieldLabel: ‘銀行帳號‘                         },{                             name:‘financer‘,                             xtype:‘textfield‘,                             allowBlank:true,                             fieldLabel: ‘賬單負責人‘                         },{                            fieldLabel : ‘納稅人證明1*‘,                            xtype : ‘fileuploadfield‘,                            name : ‘taxpayerFile1‘,                            allowBlank:false,                            buttonText: ‘瀏覽‘,                        },{                            fieldLabel : ‘納稅人證明2*‘,                            xtype : ‘fileuploadfield‘,                            name : ‘taxpayerFile2‘,                            buttonText: ‘瀏覽‘,                            allowBlank:true,                        },{                            fieldLabel : ‘合約檔案‘,                            xtype : ‘fileuploadfield‘,                            name : ‘docmentFile‘,                            buttonText: ‘瀏覽‘,                            allowBlank:true,                        },{                            fieldLabel: ‘服務開始時間*‘,                                            name: ‘sdate‘,                            allowBlank:false,                            xtype:‘datefield‘,                            format:‘Y-m-d‘,                        },{                            fieldLabel: ‘服務結束時間*‘,                                            name: ‘edate‘,                            allowBlank:false,                            xtype:‘datefield‘,                            format:‘Y-m-d‘                        },{                            fieldLabel: ‘付費賬期/天*‘,                                            name: ‘paymentDays‘,                            allowBlank:false,                            xtype:‘numberfield‘                        },{                            fieldLabel: ‘金額/月*‘,                                            name: ‘amount‘,                            allowBlank:false,                            xtype:‘numberfield‘                        },{                            fieldLabel: ‘銷售人*‘,                                            name: ‘saler‘,                            allowBlank:false,                            xtype:‘textfield‘                        },{                            fieldLabel: ‘備忘‘,                                            name: ‘content‘,                            height:135,                            allowBlank:true,                            xtype:‘textarea‘                        }                    ],                     buttons:[{                        text:‘確定‘,                        handler: function(){                            var form =uploadForm.getForm();                            form.submit({                                url: adr,                                method:‘POST‘,                                params: {                                    clientId: clientId                                },                                success: function(from,action){                                    if(action.result){                                         Ext.MessageBox.alert(‘提示‘,action.result.message);                                    }else{                                        Ext.MessageBox.alert(‘提示‘,‘傳回值不存在‘);                                    }//                                    uploadForm.getForm().reset();                                }, failure: function (from,action) {                                    Ext.MessageBox.alert(‘失敗‘,"上傳失敗,請檢查內容後嘗試!");                                    win.hide();                                 },                            });                        }                        }]                }) ;                uploadForm.load({　　//動態載入資料                    url:findadr,                });                var win=new Ext.Window({                        title : ‘上傳新文檔‘,                          width : 600,                          autoHeight: true,                          border : false,                          plain : true,                          modal : true,                          layout : ‘fit‘,                          bodyStyle : ‘padding:5px;‘,                          maximizable : false,// 禁止最大化                          closeAction : ‘hide‘,                          closable : true,// 是否有關閉                          collapsible : false,// 可摺疊                          iconCls : ‘bind‘,                          buttonAlign:‘center‘,                        items : [uploadForm],                    });                win.show();                },

結果:

Extjs在form展示後台單個對象的屬性