Ajax调用成功,但无法从$ _POST获取无线电值

时间:2015-07-29 19:50:52

标签: javascript php jquery html ajax

我的网站是完全异步的,大多数html都会在按下按钮时被创建和销毁,并且每个html都会阻止导航。

在这一部分,我制作一个表格,其中"率为1到10" radioboxes数组,使用jQuery.ajax()发送它并将其发送到进程,它回显(现在)或echo"没有选择任何内容。"。

这是表格,

<?php
<form id="surveyForm" action="processSurvey.php" method="post">

    <h3>Alimentos</h3>

    <h4>Sabor</h4>
    <div class="form-group">';
        for ($i = 0; $i <= 10; $i++) {
            echo '
                <span class="lead form-options">' .'</span>
                <label class="radio-inline">
                    <input type="radio" name="sabor" id="saborRadio'. $i .'" value="'. $i .'">'. $i.'
                </label>';

        }
        echo '
    </div>

    <div class="form-group">
        <button class="btn btn-default surveyForm-btn" type="submit">Enviar</button>
    </div>

</form>
?>

这是javascript:

$('body').on('click', '.surveyForm', function(){
        console.log("Clicked on .surveyForm-btn");
        var data = $('#surveyForm').serialize();
        console.log( data );
        $.ajax({
            method: "POST",
            url: "processSurvey.php", 
            data: data, 
            success: function(result){
                console.log("Ajax call to processSurvey success");
                $("#surveyForm").clearForm();
                console.log(result);
                console.log( data );

            } 
        });
        return false;
    });

这是php的过程:

<?php
if (isset($_POST['sabor']))   // if ANY of the options was checked
  echo $_POST['sabor'];    // echo the choice
else
  echo "nothing was selected.";
print_r($_POST);
?>

这是使用选定的radiobox单击提交后的控制台:

Clicked on #surveyForm
[EMPTY LINE]
Ajax call to processSurvey success
nothing was selected.
[EMPTY LINE]

这表示提交成功,但表单数据为空。我从昨天开始就一直试图找到这个问题,我很确定我传递的数据不对,但是谷歌找不到任何我没想过的东西。< / p>

编辑:添加了大多数sugestions,问题仍然存在。也许html结构错了?表格和提交似乎没有关联。

编辑2:我发现一些非常奇怪的东西,在最终代码中似乎有一个额外的结束标记,就像这样

<form id="surveyForm" action="processSurvey.php" method="post"></form>
    <h3>Alimentos</h3>
    <h4>Sabor</h4>

我不知道这是从哪里来的,但是肯定是问题所在。

2 个答案:

答案 0 :(得分:2)

这里有很多笔记

1-您会对form id='surveyForm'button class='surveyForm'感到困惑,所以最好将其更改为按钮class ='surveyForm_btn'

2-我认为您应该将表单序列化而不是按钮

var data = $('#surveyForm').serialize(); // not .surveyForm

3- ID必须是唯一的

4- $("#surveyForm").clearForm(); // not .surveyForm

最后检查所有评论

最好使用

$('body').on('submit', '#surveyForm', function(){});

编辑回答: 1-请在每个步骤后检查所有内容

<form id="surveyForm" action="processSurvey.php" method="post">
   <h3>Alimentos</h3>
   <h4>Sabor</h4>
   <div class="form-group">
    <button class="btn btn-default surveyForm-btn" type="submit">Enviar</button>
   </div>
</form>

在js

$('body').on('submit', '#surveyForm', function(){
        var data = $(this).serialize();
        $.ajax({
            method: "POST",
            url: "processSurvey.php", 
            data: data, 
            success: function(result){
                console.log(result);
            } 
        });
        return false;
    });

在php中

<?php
echo 'Connected successfully';
?>

此代码将在控制台中成功输出已连接..如果此工作添加您的for循环并再次进行检查

答案 1 :(得分:0)

尝试写下你的htm:

    <h3>Alimentos</h3>

    <h4>Sabor</h4>
    <div class="form-group">
<?php
        for ($i = 0; $i <= 10; $i++) {
         ?>
                <span class="lead form-options"></span>
                <label class="radio-inline">
                    <input type="radio" name="sabor" id="saborRadio<?=$i ?>" value="<?= $i ?>" /><?= $i?>
                </label>
<?php
        } ?>
    </div>

    <div class="form-group">
        <button class="btn btn-default surveyForm-btn" type="submit">Enviar</button>
    </div>

</form>