Ext.js二級聯動

阿新 • • 發佈：2019-04-25

class combo tex 選擇 tps rec test back classic

<!DOCTYPE html>
<html>
   <head>
           <meta charset="utf-8">
      <link href="https://cdn.bootcss.com/extjs/6.0.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet">
   <script src="https://cdn.bootcss.com/extjs/6.0.0/ext-all.js"></script>
   < 
script type="text/javascript">
    var attr_city = ["嘉峪關","金昌"];
    var attr_county = [
                    [‘嘉峪關‘],
                    [‘河西堡‘,‘永昌縣‘,‘金昌區‘]
                ];
   
 Ext.onReady(function () {    
            //定義新的類FormPanel，並且把變化的屬性暴露出來以便以後繼承
            var MyFormPanel = Ext.extend(Ext.form.FormPanel, {
                title:  
‘級聯‘,
               layout : ‘table‘,
                layoutConfig : {columns:8},
                labelWidth: 80,
                initComponent: function () {
                    this.items = [
                    {
         fieldLabel : ‘市‘,
         hiddenName : ‘tmember.addressProvince‘,
         xtype :  
‘combo‘,
         allowBlank : false,
         width:180,
         labelWidth:20,
         emptyText : ‘請選擇市‘,
         mode : ‘local‘,
         displayField : ‘provinceName‘,
         valueField : ‘id‘,
         id : ‘city‘,
         editable : false,
         triggerAction : ‘all‘,
         lazyInit : false,
         store :attr_city,
         listeners:{
           select : function(combo, record, index){
           console.log(attr_county[record.internalId-1])
           var fieldName=Ext.getCmp(‘county‘);
           console.dir(fieldName)
           Ext.getCmp(‘county‘).setValue(attr_county[record.internalId-1][0]);
           Ext.getCmp(‘county‘).setStore(attr_county[record.internalId-1]);

           }
       }
               },
          {
        fieldLabel : ‘縣‘,
        labelWidth:20,
         hiddenName : ‘county‘,
         xtype : ‘combo‘,
         width:180,
         allowBlank : false,
         emptyText : ‘請選擇縣‘,
         mode : ‘local‘,
         displayField : ‘county‘,
         valueField : ‘county‘,
         id : ‘county‘,
         editable : false,
         triggerAction : ‘all‘,
         lazyInit : false,
         store:‘‘
               },
                       
          {
          fieldLabel : ‘地址‘,
          labelWidth:40,
          id:‘county1‘,
          xtype : ‘textfield‘,
          grow : false,
          colspan : 8
            }
                    ];
                    this.buttons = [{
                        text: ‘確 定‘,
                        handler: this.submit,//變化的部份
                        scope: this
                    }, {
                        text: ‘取 消‘,
                        handler: this.cancel,//變化的部份
                        scope: this
                    }];
                    MyFormPanel.superclass.initComponent.call(this, arguments); //調用父類的initComponent
                }
            });
           
            //創建測試對象2
            var testForm2=new MyFormPanel({
                title: ‘覆蓋屬性‘,
                usernameid:‘usernameid‘,
                submit: function () {
                    alert(this.usernameid);
                },
                cancel: function () {
                    testForm2.getForm().reset();
                }
            });
            //創建窗體
            var win = new Ext.Window({
                title: ‘窗口‘,
                id: ‘window‘,
                width: 700,
                height: 420,
                resizable: true,
                closable: true,
                maximizable: true,
                minimizable: true,
                items: [testForm2]
            });
            win.show();
        });
      </script>
   </head>
   <body>
   </body>
</html>

Ext.js二級聯動

class combo tex 選擇 tps rec test back classic <!DOCTYPE html> <html> <head> <meta charset="utf-8"&

js 二級聯動（轉）

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath =

div展示聯動，js二級聯動城市選擇，非下拉框

// 省份城市的聯動 var oC=document.getElementsByClassName('oc'); var oCity=document.getElementById('oCity'); var city = [];//申明　　//定義二級資料 city[0] = ['

原生js的二級聯動

長沙湖北合肥 city array 河北 .text 長春佛山 <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title&g

原生JS的地區二級聯動，很好理解的邏輯

貴陽江北區 getc width 臺灣省 mpat 泰安漯河廣東 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta

用js和jq分別實現二級聯動效果

js jq 二級聯動界面：兩個下拉框。用js方法實現:用jq方法實現:註意：在js中的for(var a in 數組) 其中的變量a依舊是下標，不是元素的值，跟其他的語言有點不一樣。同時，在js中，數組的下標是可以存放文字的。用js和jq分別實現二級聯動效果

分別使用js和JQuery實現省市二級聯動

1.1html js中this指的是當前操作的物件 <tr> <td>籍貫</td> <td><select onchange="changeCity(this.value)" id="province" &g

Ajax,js實現省市二級聯動

Ajax，js實現省市二級聯動這裡不羅嗦，直接放圖，分析。如圖實現效果。如下：前端程式碼分析：後端程式碼，相當簡單，只需要查詢資料庫，省份放一個list集合，城市放一個list集合，回寫響應給前端。前端通過迴圈，一一獲取。 response.setContentType(“

JS-省市二級聯動

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <t

原生js實現省市二級聯動

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>註冊頁面重新佈局</title> <style type="text/css

二級聯動--js

在html部分只寫兩個select標籤 option標籤將用js的方法寫入 onchange:內容發生改變事件用於select下拉選單中後的內容發生改變時候的觸發 <body> <select id="province" onchange="

前端js 節點dom操作單選下拉複選二級聯動這一篇都有

<%@ page language="java" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme(

JS實現二級聯動 (createTextNode，createElement )

JS中只有陣列，沒有集合陣列長度=角標+1 長度可變 cities[0],cities[1],cities[2],cities[3] cities[100] 長度是101 而不是5 <!DO

原生js用ajax編寫省市聯動，二級聯動

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>城市聯動</

js實現下拉框二級聯動

在做專案的時候，一個新增問題題目，選項和答案的問題，題目型別分為選擇題，判斷題，和多選題三種，此處需要新增一個二級聯動的功能，即當題型為選擇題的時候，正確選項的下拉框裡出現的是A,B,C,D.如果題型是判斷題，正確選項的下拉框內容為正確，錯誤，如果題型型別為多選題，則正確答案的輸入框變為可輸

用js+html5實現二級聯動省份下拉選單

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>二級聯動省份下拉框</title> </head> &

Js省市二級聯動

一、javascript 採用二維陣列的方式做了個簡單的省市級二級聯動 <!DOCTYPE html> <html lang="en"> <head> &

js 省市二級聯動選單thinkphp mysql js

參考http://blog.csdn.net/wmsjlihuan/article/details/20700763 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww

js實現省市選擇二級聯動

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> &

用js解析xml實現省市二級聯動

html頁面表單部分 <select name="province" id="province" onchange="javascript:loadCity();"> <option value="0" selected="s

Ext.js二級聯動

相關推薦