Question

如何在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" >

.
.
.
.

谢谢：））

Answer 1

你可以试试这段代码：

<!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>

如何使用AJAX get方法发送多个无线电值

1 个答案: