2016-06-24 5 views
0

AJAXリクエストで複数のラジオボタンの状態の値を送信するにはどうすればよいですか?AJAXで複数のラジオ値を送信する方法

はJavaScript:

$(document).ready(function(){ 
    $("#action").click(function(){ 

      var title = []; 
      var type = []; 


      $(".title").each(function() { 
       title.push($(this).val()); 
      }); 

      $(".type").each(function() {///i don't know what put there 
       type.push($(this).val()); 
      }); 

      $.ajax({ 
       type: 'POST', 
       url: 'create', 
       data: { 
        title: title, 
        type: type 
        },  
       success: function (data) { 
        $('#result').html(data); 
       } 
      }); 

    }); 

}); 

HTMLコード:

number 1 
<input class="form-control title" name="title[]" type="hidden" /> 

<input class="type" type="radio" name="type[]" value="0" > 
<input class="type" type="radio" name="type[]" value="1" > 
<input class="type" type="radio" name="type[]" value="3" > 


number 2 
<input class="form-control title" name="title[]" type="hidden" /> 

<input class="type" type="radio" name="type[]" value="0" > 
<input class="type" type="radio" name="type[]" value="1" > 
<input class="type" type="radio" name="type[]" value="3" > 


number 3 
<input class="form-control title" name="title[]" type="hidden" /> 

<input class="type" type="radio" name="type[]" value="0" > 
<input class="type" type="radio" name="type[]" value="1" > 
<input class="type" type="radio" name="type[]" value="3" > 

. 
. 
. 
. 

感謝:))

+0

を何をする? – denchu

+0

あなたはそれぞれの数値に対して選択された値を取得したいのですか? –

+0

あなたはそれらを配列に入れて、ajaxに送ることができます – guradio

答えて

0

あなたはこのコードを試すことができます:あなたは正確に何をしようとしている

<!DOCTYPE html> 
<link href="~/Content/bootstrap.min.css" rel="stylesheet" /> 
<script src="~/Scripts/jquery-1.10.2.min.js"></script> 
<script src="~/Scripts/bootstrap.min.js"></script> 

<script> 
    $(document).ready(function() { 
     //$.get('/controller/MyAction', $.param({ data: array }, true), function (data) { }); 
     $("#btnSubmit").click(function() { 
      var qs = new Array; 
      qs.push($("input[type='radio'][name='Q1']:checked").val()); 
      qs.push($("input[type='radio'][name='Q2']:checked").val()); 
      //var datax = JSON.parse({ Qs: qs }); 

      $.ajax({ 
       method: "POST", 
       url: '@Url.Action("GetAnswers", "Sample")', 
       traditional: true, 
       data: JSON.stringify({ Qs : qs }), 
       contentType: "application/json; charset=utf-8", 
       success: function (data) { 
        alert(data); 
       } 
      }); 
     }); 
    }); 
</script> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Index</title> 
</head> 
<body> 
    <div claas="row"> 
     <div class="row"> 
      <div class="col-md-5"><label>Question 1: 1 x 2 = ?</label></div> 
     </div> 
     <div class="row"> 
      <div> 
       <input class="type" type="radio" name="Q1" value="0"> 
       <input class="type" type="radio" name="Q1" value="1"> 
       <input class="type" type="radio" name="Q1" value="3"> 
      </div> 
     </div> 
    </div> 

    <div claas="row"> 
     <div class="row"> 
      <div class="col-md-5"><label>Question 2: 2 x 0 = ?</label></div> 
     </div> 
     <div class="row"> 
      <div> 
       <input class="type" type="radio" name="Q2" value="0"> 
       <input class="type" type="radio" name="Q2" value="1"> 
       <input class="type" type="radio" name="Q2" value="3"> 
      </div> 
     </div> 
    </div> 
    <button class="btn btn-info" id="btnSubmit">Submit</button> 

</body> 
</html> 
関連する問題