2017-08-20 13 views
0

GeoExt 2では、1つのフィールドと2つのラジオボタンを持つフォームがあります。ラジオボタンをコーディングして、そのフィールドの名前をGeoExtの規約に対応するように変更しました。GeoExt:フィールド名を変更してフィルタを変更する

items: [ 
    { 
     xtype: "numberfield", 
     itemId: 'parcel', 
     name: 'parcelAtt__ge', 
     fieldLabel: 'Parcel Number:' 
    }, 
    { 
     xtype: 'radiogroup', 
     fieldLabel: 'Search type:', 
     columns: 2, 
     vertical:true, 
     items: [ 
      { 
       boxLabel: 'greater than', 
       name: 'option', 
       inputValue: '1', 
       submitValue: false, 
       checked: true, 
       listeners: { 
        change: function (field, newValue, oldValue) { 
         if (newValue) myPanel.down('#parcel').inputEl.dom.name = 'parcelAtt__ge'; 
        } 
       } 
      }, 
      { 
       boxLabel: 'lower then', 
       name: 'option', 
       inputValue: '2', 
       submitValue: false, 
       listeners: { 
        change: function (field, newValue, oldValue) { 
         if (newValue) myPanel.down('#parcel').inputEl.dom.name = 'parcelAtt__le'; 
        } 
       } 
      }, 
     ] 
    } 
], 

私は上記のコードは、HTMLのフィールド名を変更しますが、フォームを送信する際、GeoExtはOpenLayersをフィルターを設定するには、新しいフィールド名を使用していないこと(Firebugを経由して)確認することができます。

ヒントまたは解決策はありますか?

答えて

1

は、ExtJSには、まったくHTMLフォームの提出を使用しません。

2つの解決策:

どちらかあなたがフィールド上setName機能を使用できるかどうかを試すことができます。

myPanel.down('#parcel').setName('parcelAtt__le') 

それとも、事前に定義された名前を持つ2つのフィールドを使用する必要があり、との間の値を同期させますそれら:

items: [{ 
    xtype: "numberfield", 
    itemId: 'parcelGe', 
    name: 'parcelAtt__ge', 
    fieldLabel: 'Parcel Number:' 
},{ 
    xtype: "numberfield", 
    hidden: true, 
    itemId: 'parcelLe', 
    name: 'parcelAtt__le', 
    fieldLabel: 'Parcel Number:' 
},{ 
    xtype: 'radiogroup', 
    fieldLabel: 'Search type:', 
    columns: 2, 
    vertical:true, 
    simpleValue: true, 
    items: [{ 
     boxLabel: 'greater than', 
     name: 'option', 
     inputValue: 'ge', 
     submitValue: false, 
     checked: true 
    },{ 
     boxLabel: 'lower than', 
     name: 'option', 
     inputValue: 'le', 
     submitValue: false 
    }], 
    listeners: { 
     change: function (field, newValue, oldValue) { 
      var leField = myPanel.query('#parcelLe'), 
       geField = myPanel.query('#parcelGe'); 
      if(newValue=='le') { 
       leField.show(); 
       geField.hide(); 
       leField.setValue(geField.getValue()); 
      } 
      else if(newValue=='ge') { 
       geField.show(); 
       leField.hide(); 
       geField.setValue(leField.getValue()); 
      } 
     } 
    } 
}], 
+0

ありがとう@アレクサンダー。私は別の方法を学んだ。 – ALalavi

0

私の間違いが見つかりました。私はDom要素を直接変更すべきではありません。

Ext.define('MyApp.form.field.Base', { 
     override: 'Ext.form.field.Base', 
     setName: function(name) { 
     this.name = name; 
     } 
    }); 

、その後、ラジオボタンのイベントハンドラでは、そのメソッドを使用して、のように:代わりに、私は(驚くべきことに、唯一のgetNameメソッドは、デフォルトでは内線JS 5.1で提供される)以下のように、フィールドへのsetNameメソッドを追加する必要がありました次の:あなたの形式のファイルアップロードフィールドを持っている場合を除き、入力要素の名前が使用されていないので、

if (newValue) myPanel.down('#parcel').setName('parcelAtt__ge'); 
関連する問題