2017-09-25 20 views
0

ラジオボタンの値を取得し、それをパラメータとしてフォームに送信する必要があります。私は以下のコードブロックを書いたが、最初の値を渡すたびに書かれている。誰かが助けてくれましたか?ExtJSラジオボタンの値の取得

Ext.onReady(function() { 
Ext.getCmp('myButton').setHandler(function(){ 

    Ext.MessageBox.show({ 
     title: 'Hello', 
     msg:  'Please choose one? <br></br> Select: '+ 
     '<input type="radio" name="newrate" value="Yes" checked /> Yes'+ 
     '<input type="radio" name="newrate" value="No" /> No', 
     buttons: Ext.MessageBox.OKCANCEL, 
     fn: function(btn) { 
      if(btn == 'ok') { 
       alert(Ext.get('newrate').getValue()); 
        var form = Ext.getCmp("MyForm").getForm(); 
        form.getEl().dom.action="${pageContext.request.contextPath}/peer.online.MyForm.grid.action?mode=StornoDX&value="+Ext.get('newrate').getValue(); 
        form.getEl().dom.method="POST"; 
        form.getEl().dom.submit(); 
       } 
     } 
    }); 
}); 
}); 

答えて

0

まず、そのないExtJSのラジオボタンExt.get()は、その入力としてid持つHTML要素を取得するために使用されます。あなたの場合、html要素の名前は"newrate"です。ですから、このように、使用してチェックラジオボタンの値(ブラウザ用> IE8document.querySelector()を取得することができます:

document.querySelector('[name=newrate]:checked').value 

サンプルワーキングコード:(ブラウザ用> IE8

Ext.application({ 
 
     name: 'Fiddle', 
 

 
     launch: function() { 
 
     Ext.MessageBox.show({ 
 
     title: 'Hello', 
 
     msg:  'Please choose one? <br></br> Select: '+ 
 
     '<input type="radio" name="newrate" value="Yes" checked /> Yes'+ 
 
     '<input type="radio" name="newrate" value="No" /> No', 
 
     buttons: Ext.MessageBox.OKCANCEL, 
 
     fn: function(btn) { 
 
      if(btn == 'ok') { 
 
       alert(document.querySelector('[name=newrate]:checked').value); 
 
        
 
       } 
 
     } 
 
    }); 
 
     } 
 
     });
<link rel="stylesheet" href="https://cdn.sencha.com/ext/gpl/4.1.1/resources/css/ext-all.css"> 
 
<script type="text/javascript" src="https://cdn.sencha.com/ext/gpl/4.1.1/ext-all-debug.js"></script>

IE8以下ブラウザがサポートしていません:checked CSS3 s選挙人。だから我々は、すべてのラジオボタンをループする必要があると確認され、ラジオボタンを見つけて、その値を取得する:

var buttons = document.getElementsByName("newrate"); 
    for(var i = 0; i < buttons.length; i++) {   
     if(buttons[i].checked) { 
     alert(buttons[i].value); 
     break; 
     } 
    } 

サンプルワーキングコード:(すべてのブラウザ用

Ext.application({ 
 
     name: 'Fiddle', 
 

 
     launch: function() { 
 
     Ext.MessageBox.show({ 
 
     title: 'Hello', 
 
     msg:  'Please choose one? <br></br> Select: '+ 
 
     '<input type="radio" name="newrate" value="Yes" checked /> Yes'+ 
 
     '<input type="radio" name="newrate" value="No" /> No', 
 
     buttons: Ext.MessageBox.OKCANCEL, 
 
     fn: function(btn) { 
 
      if(btn == 'ok') { 
 
var buttons = document.getElementsByName("newrate"); 
 
    for(var i = 0; i < buttons.length; i++) {   
 
     if(buttons[i].checked) { 
 
     alert(buttons[i].value); 
 
     break; 
 
     } 
 
    }      
 
       } 
 
     } 
 
    }); 
 
     } 
 
     });
<link rel="stylesheet" href="https://cdn.sencha.com/ext/gpl/4.1.1/resources/css/ext-all.css"> 
 
<script type="text/javascript" src="https://cdn.sencha.com/ext/gpl/4.1.1/ext-all-debug.js"></script>

+0

答えのAnkitに感謝します。もう1つ質問がありますが、これにはブラウザの制限がいくつかあります。私はChrome上でうまく動作しますが、IE8では問題に直面しています。すべてのブラウザで動作させるための選択肢はありますか? –

+0

Ohh .. IE 8は ':checked' CSSセレクタをサポートしていません。したがって、ラジオボタンをループして、チェックされた値を見つける必要があります。私はそれに応じて私の答えを更新しました –

+0

ありがとう。これは私の質問を解決します。 –

関連する問題