フォームのラジオボタンでテーブル値を送信する方法は？

Question

例

表で

HTMLコード

<table> 
 
    <tr> 
 
    <td> <input type='text' value='example 1' name='text1' /></td> 
 
    <td> <input type='radio' value='example 1' name='radio1' /></td> 
 
    </tr> 
 
    <tr> 
 
    <td> <input type='text' value='example 2' name='text2' /></td> 
 
    <td> <input type='radio' value='example 2' name='radio2' /></td> 
 
    </tr> 
 
    <tr> 
 
    <td> <input type='text' value='example 3' name='text3' /></td> 
 
    <td> <input type='radio' value='example 3' name='radio3' /></td> 
 
    </tr> 
 
</table>

ラジオボタンをクリックした場合

ボタン

1がクリックされたときに私がクリックした値を送信したい - >ラジオを送ります1の値

2をクリック - >ラジオ2値に

3を送ってクリック - >ラジオ3値に

をSENSので、フォームをラジオボタンをテーブル値を送信するためにどのように

を疑問視？

Answer 1

これはjavascriptで行うことができます。入力ごとにclickイベントに「リッスン」してください。

ajaxを使用してサーバーに送信できます。

[].forEach.call(document.querySelectorAll('input'), function(input) { 
 
    input.addEventListener('click', function(elm) { 
 
    console.log(input.value); 
 
    // Send this value to the server with ajax or something 
 
    }); 
 
});

<table> 
 
    <tr> 
 
    <td> <input type='text' value='example 1' name='text1' /></td> 
 
    <td> <input type='radio' value='example 1' name='radio1' /></td> 
 
    </tr> 
 
    <tr> 
 
    <td> <input type='text' value='example 2' name='text2' /></td> 
 
    <td> <input type='radio' value='example 2' name='radio2' /></td> 
 
    </tr> 
 
    <tr> 
 
    <td> <input type='text' value='example 3' name='text3' /></td> 
 
    <td> <input type='radio' value='example 3' name='radio3' /></td> 
 
    </tr> 
 
</table>

Answer 2

次のようなコードに何かの助けを借りてデータを送信することができます。 sendValue関数でXMLHttpRequestを使用してデータを送信するコードを記述することができます。

var sendValue = function() 
 
{ 
 
    alert(this.value); 
 
} 
 

 
var inputTags = document.getElementsByTagName('input'); 
 
    
 
for (var i=0;i<inputTags.length;i++){ 
 
    if(inputTags[i].type == "radio") 
 
    { 
 
    inputTags[i].addEventListener("click", sendValue); 
 
    } 
 
}

<table> 
 
    <tr> 
 
    <td> <input type='text' value='example 1' name='text1' /></td> 
 
    <td> <input type='radio' value='example 1' name='radio1' /></td> 
 
    </tr> 
 
    <tr> 
 
    <td> <input type='text' value='example 2' name='text2' /></td> 
 
    <td> <input type='radio' value='example 2' name='radio2' /></td> 
 
    </tr> 
 
    <tr> 
 
    <td> <input type='text' value='example 3' name='text3' /></td> 
 
    <td> <input type='radio' value='example 3' name='radio3' /></td> 
 
    </tr> 
 
</table>