AJAX отправляет неверную информацию

Question

поэтому у меня есть 3 кнопки радиосвязи с разными значениями, когда я выбираю один из них, он всегда дает мне значение «3» или последнее значение them.I пробовал отправить без ajax, это отлично работает!

ВОТ МОЯ .js код

$(document).ready(function(){ 

$('form').on('submit', function() { 
    var that = $(this), 
    url = that.attr('action'), 
    type = that.attr('method') , 
    data = {}; 

    that.find('[name]').each(function(index, value){ 
     var that = $(this), 
     name = that.attr('name'), 
     value = that.val(); 


     data[name] = value; 
    }); 

     $.ajax({ 
     url: url, 
     type: type, 
     data: data, 
     success : function(rdata) { 
       $("#st").html(rdata); 
     } 
    }); 

    return false; 
}); 
}); 

И вот мой HTML:

<form action="test.php" id="send" method="POST" accept-charset="UTF-8" autocomplete="off"> 
<table> 
    <tr><td><input type="radio" name="val" value="1">1</td></tr> 
    <tr><td><input type="radio" name="val" value="2">2</td></tr> 
    <tr><td><input type="radio" name="val" value="3">3</td></tr> 
    <tr><td><input type="submit"></td></tr><tr><td><div id='st'></div>/td></tr>   

</table> 

test.php:

if (isset($_POST['val'])) { 
    $val = $_POST['val']; 
    echo $val; 
} 

Answer 1

Чтобы просто исправить эту проблему, вы должны изменить следующую строку следующим образом:

..  
that.find('[name]:checked').each(function(index, value){ 
.. 

Что ты делая это, выполняет итерацию через все переключатели и всегда назначает значение вашей переменной, независимо от статуса проверки переключателя. С модификатором :checked вы говорите ему, что смотрите только на элементы, которые проверяются (и фактически, .each в этом случае не совсем необходимо). Вы можете изменить его, как это (как правило, имеет только один радио проверило), замените .each итерацию со следующим:

checkedRadio = that.find('[name]:checked'); 
name = checkedRadio.attr('name'); 
value = checkedRadio.val(); 

data[name] = value; 

Answer 2

Попробуйте использовать следующий фрагмент кода для получения выбранного радиообъекта va lue Теперь вы выполняете итерацию по всем радиообменам и отправляете данные для значения кнопки (поэтому всегда в каждой из() отправляется).

$('input[name=val]:checked').val() 

Я обновил ответ с кодом заполненный:

$(document).ready(function(){ 

$('form').on('submit', function() { 
    var that = $(this), 
    url = that.attr('action'), 
    type = that.attr('method') , 
    data = {}; 

    data[name] = $('input[name=val]:checked').val(); 

     $.ajax({ 
     url: url, 
     type: type, 
     data: data, 
     success : function(rdata) { 
       $("#st").html(rdata); 
     } 
    }); 

    return false; 
}); 
}); 

Answer 3

Рабочих Демо: JSFiddle - You can check console network it is sending the data.

Вы хотите, чтобы получить значение кнопки радио, которое проверяется, так что вы можете использовать $('input[name=val]:checked').val()

попробовать так:

$(document).ready(function(){ 

     $('form').on('submit', function() { 
     var that = $(this), 
     url = that.attr('action'), 
     type = that.attr('method') , 
     data = {}; 

     //data[name] = $('input[name=val]:checked').val(); 

     $.ajax({ 
      url: url, 
      type: type, 
      data: 'val = '+$('input[name=val]:checked').val();, 
      success : function(rdata) { 
       $("#st").html(rdata); 
      } 
     }); 

     return false; 
    }); 
}); 

Вы можете получить значение в файле test.php, как это:

if (isset($_POST['val'])) { 
    $val = $_POST['val']; 
    echo $val; 
}