ext ComboBox 连动

最新推荐文章于 2024-05-16 09:20:46 发布

dwj520

最新推荐文章于 2024-05-16 09:20:46 发布

阅读量567

点赞数

文章标签： ext stylesheet function html 平台 div

本文链接：https://blog.csdn.net/dwj520/article/details/5085515

版权

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>panel.html</title>

        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">

        
        <link rel="stylesheet" type="text/css"
            href="scripts/ext/resources/css/ext-all.css" />
        <script type="text/javascript"
            src="scripts/ext/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="scripts/ext/ext-all.js"></script>
    </head>
    <body>
        <script type="text/javascript">
        Ext.onReady(function() {
      var cities = [['北京',
              [
              ['北京'],
              ['通县'],
              ['昌平'],
              ['大兴'],
              ['密云'],
              ['顺义'],
              ['平台']
         ]],
         ['广东',
             [
                 ['潮州'],
                 ['汕头']
             ]
         ]
     ];

     var localProvince = new Ext.data.SimpleStore({
         fields: ['provinces', 'cities'],
         data: cities
     });

     var localcities = new Ext.data.SimpleStore({
         fields: ['cities'],
         data: []
     });

     var frm = new Ext.form.FormPanel({
         title: 'combo',
         width: 300,
         autoHeight: true,
         applyTo: 'con',
         frame: true,
         labelWidth: 50,
         labelAlign: 'right',
         items: [
             {
                 xtype: 'combo',
                 triggerAction: 'all',
                 anchor: '80%',
                 fieldLabel: 'Provinces',
                 editable: false,
                 mode: 'local',
                 store: localProvince,
                 displayField: 'provinces',
                 name: 'provinces',
                 listeners: {
                     select: function(form, rec, index) {
                         frm.getForm().findField('cities').clearValue();
                         localcities.loadData(rec.get('cities'));
                     }
                 }
             }, {
                 xtype: 'combo',
                 triggerAction: 'all',
                 anchor: '80%',
                 fieldLabel: 'cities',
                 editable: false,
                 name: 'cities',
                 mode: 'local',
                 displayField: 'cities',
                 store: localcities
            }
         ]
     });

});

    </script>
        <script type="text/javascript" src="user/check-radio.js"></script>
        <div id="con"></div>

    </body>
</html>