Common configuration methods for ExtJs4
New Ext. viewport ({layout: "border", renderTo: Ext. getBody (), defaults: {bodyStyle: "background-color: # FFFFFF;", frame: true}, // If split is true, the upper, lower, and lower sides of the image can be stretched. // layout: fit, fill layout // collapsible: true, the north module is reduced to the top items: [{region: "north", height: "60%", collapsible: true, split: true, layout: "fit", border: true, items: [ClassTreeGrid]}, {region: "center", autoScroll: true, split: true, border: true, Layout: "fit", items: [RecGrid]}); copy the code Ext. window. window stretch properties, as well as textareafield, form's tensile properties reminder: resizable: true, // whether it can be stretched, also applies to copy Code such as textareafield, form var AddDialog = Ext. create ("Ext. window. window ", {layout:" fit ", iconCls: 'A _ add', closeAction: 'hide ', // method of closing the Window: hide/close resizable: true, // whether closable: true can be stretched, // whether modal: true can be closed, // whether it is a modal window items: AddForm, buttons: [{text: 'add', iconCls: 'A _ add', id: "btnAdd", handler: add}, {id: "btnCancel", iconCls: 'A _ cross ', text: 'reset', handler: function () {AddForm. form. reset () ;}}]}); copy the code to an empty default value, verify the configuration, and verify the method. Copy the code var AddForm = Ext in column layout. create ("Ext. form. panel ", {border: false, fieldDefaults: {msgTarget: 'android', // The icon labelWidth: 70, align:" right ", allowBlank: false // not Blank}, width: 380, ults: {padding: 10,}, layout :' Column ', items: [{xtype: "hidden", name: 'quid',}, {xtype: "numberfield", fieldLabel: 'Question number', name: 'sorts', regex:/^ \ d + $/, // Regular Expression verification maxLength: 100, columnWidth: 1, },{ xtype: "combo", fieldLabel: 'skin category', name: 'cladd', id: 'cladid', valueField: 'qcid', displayField: 'claname', columnWidth: 1, // ratio of the column layout Station, which is 1 in total, divided into 0.5 + 0.5 .... and 1 allowBlank: false, store: QuestionClassStore, emptyText: "select skin Classification ",/ /The blank input box prompts "Please select Skin Category 111", // error prompt}, {xtype: "filefield", fieldLabel: 'upload image', buttonText: 'browse ', regex:/^. + \. (jpg) | (gif) | (png) | (jpeg) | (bmp) $/, // Regular Expression verification name: 'queimg ', allowBlank: true, // It is not allowed to be empty columnWidth: 1}, {xtype: "textareafield", grow: true, fieldLabel: 'none', name: 'Question ', columnWidth: 1}]}); // Add question function Add () {var form = AddForm. getForm (); // get form if (M. isValid () {// verify the form. submit ({url: "/question/Add", params: {json: Ext. JSON. encode (AddForm. form. getValues ()}, waitMsg: 'uploading. Please wait... ', success: function (form, action) {Ext. msg. alert ("prompt", action. result. msg); QuestionGridStore. load () ;}}}} copy the code to assign a value to the img path src. Copy the code itemclick: function () {var rows = ShopPaperGrid. getView (). getSelectionModel (). getSelection (); if (typeof (rows [0])! = "Undefined") {Ext. getCmp ("imgForm "). getEl (). dom. src = rows [0]. data. imgPath; // assign a value to src} else {Ext. getCmp ("imgForm "). getEl (). dom. src = "/images/default.jpg";} copy the code ext. msg. confrim () copy the code Ext. msg. confirm ("prompt", "confirm to delete", function (btn) {// btn = yes or no if (btn = "yes ") {alert ("deleted successfully") ;}else {alert ("canceled ");}});