Ajax与其他参数序列化，

时间：2016-07-21 12:50:13

标签： javascript php jquery mysql ajax

我非常接近这项工作。我只是遇到一个变量（q3）的问题。

我一直在努力使用ajax，php和MySQL将一些数据导入数据库。除了问题3 之外，一切正常。所有数据都提交，但数据库中的问题3始终为空......

有没有人有任何想法？我是使用serialize（）的新手，但在控制台中记录它会显示所有复选框的字符串。

请注意，这只是代码的一个子集。 谢谢。

HTML： 

<div id="question3" class="question_block" style="display:block;">

    <p class=""><b>3. If you don’t use the bus system, please let us know why (pick your top 3 reasons):</b></p>

    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="Buses do not go where I want to go" /> Buses do not go where I want to go
    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="Buses do not run when I need it" /> Buses do not run when I need it
    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="Buses are too crowded" /> Buses are too crowded
    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="Buses are too crowded" /> Buses are unreliable
    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="Transfers between bus routes are difficult" /> Transfers between bus routes are difficult
    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="Waiting times are too long" /> Waiting times are too long
    <input type="checkbox" name="question3_answer[]" class="question3_answer" value="I don’t live near a bus route" /> I don’t live near a bus route
    <input id="question3_other" type="checkbox" name="" class="question3_answer other" value="other" />Other:
    <input type="text" id="question3_textanswer" name="question3_answer[]" class="question3_answer" placeholder="Your answer here" style="width:40%;display:none;">

    <button id="toPlay" onclick="submit_1();">Submit and continue</button>
</div>

的Ajax： 

function submit_1() {
        var q1 = document.getElementById("question1_answer").value;
        var q2 = document.getElementById("question2_answer").value;
        var q3 = $('.question3_answer:checked').serialize();
        var q4 = document.getElementById("question4_answer").value;
        var q5 = document.getElementById("question5_answer").value;

        var dataString = 'question1_answer=' + q1 + '&question2_answer=' + q2 + '&question3_answer=' + q3 + '&question4_answer=' + q4 + '&question5_answer=' + q5;

        $.ajax({
            type: "POST",
            url: "php/video_form_process.php",
            data: dataString,
            cache: false,
            success: function(html) {
                alert(html);
            }
        });
        return false;
    }

PHP 

if (isset($_POST['question1_answer'])) {
// Gets data from URL parameters
$question1_answer = $_POST['question1_answer'];
$question2_answer = $_POST['question2_answer'];
$question3_answer = $_POST['question3_answer'];
$question4_answer = $_POST['question4_answer'];
$question5_answer = $_POST['question5_answer'];

    $query= "INSERT INTO `responses` (`uid`, `time`, `q1`,`q2`,`q3`,`q4`,`q5`, `ipaddr`) VALUES ('', '$today','$question1_answer','$question2_answer','$question3_answer','$question4_answer','$question5_answer')";

    if ($query_run = mysqli_query($server, $query)) {
        echo 'success';
    } else {
        echo 'error';
    }
}

工作Ajax： 

    function submit_1() {
        var q1 = $(".question1_answer:checked").val();
        var q2 = document.getElementById("question2_answer").value;

        var q3 = [];
        $(".question3_answer:checked").each(function() {
            q3.push($(this).val());
        });

        var q4 = document.getElementById("question4_answer").value;
        var q5 = document.getElementById("question5_answer").value;

        var dataString = 'question1_answer=' + q1 + '&question2_answer=' + q2 + '&question3_answer=' + q3 + '&question4_answer=' + q4 + '&question5_answer=' + q5;

        $.ajax({
            type: "POST",
            url: "php/video_form_process.php",
            data: dataString,
            cache: false,
            success: function(html) {
                alert(html);
            }
        });
        return false;
    }

使用PHP： 

if (isset($_POST['question1_answer'])) {
// Gets data from URL parameters
$question1_answer = mysqli_real_escape_string($server, $_POST['question1_answer']);
$question2_answer = mysqli_real_escape_string($server, $_POST['question2_answer']);
$question3_answer = mysqli_real_escape_string($server, $_POST['question3_answer']);
$question4_answer = mysqli_real_escape_string($server, $_POST['question4_answer']);
$question5_answer = mysqli_real_escape_string($server, $_POST['question5_answer']);

$query= "INSERT INTO `responses`
         (`time`, `q1`,`q2`,`q3`,`q4`,`q5`, `ipaddr`)
         VALUES ('{$today}', '{$question1_answer}', '{$question2_answer}', '{$question3_answer}', '{$question4_answer}', '{$question5_answer}', '127.0.0.1')";

if ($query_run = mysqli_query($server, $query)) {
    echo 'success';
} else {
    echo 'error';
}

}

4 个答案:

答案 0 :(得分：1)

尝试这样的事情来发布价值。

使用数组推送，你可以在s3变量中添加你的复选框值，见下面的代码。

    var s3=[];
    $("input:checked").each(function() {
       s3.push($(this).val());
    });

答案 1 :(得分：1)

一些建议......

JS

  1. 使用data的对象，而不是字符串
  2. 您可以使用map从checkes元素
    3. 创建ID数组
  3. 将dataType添加到您的ajax，以确保

    4. <强> PHP

    1. 你的$today在哪里宣布？你确定它在那里吗？
    2. 从SQL查询中删除uid
    3. 逃避价值
    4. 转义您的SQL查询
    5. 您在值中未设置IP地址

      6. <强> JS 

      function submit_1() {
    $.ajax({
        type: "POST",
        url: "php/video_form_process.php",
        dataType: "html",
        data: {
            question1_answer = $("#question1_answer").val(),
            question2_answer = $("#question2_answer").val(),
            question3_answer = $(".question3_answer:checked").map(function() {
                return $(this).val();
            }).get().join(","),
            question4_answer = $("#question4_answer").val(),
            question5_answer = $("#question5_answer").val()
        },
        cache: false,
        success: function(html) {
            alert(html);
        }
    });

    return false;
}

      <强> PHP 

      if (isset($_POST['question1_answer'])) {
    // Gets data from URL parameters
    $question1_answer = mysqli_real_escape_string($server, $_POST['question1_answer']);
    $question2_answer = mysqli_real_escape_string($server, $_POST['question2_answer']);
    $question3_answer = mysqli_real_escape_string($server, $_POST['question3_answer']);
    $question4_answer = mysqli_real_escape_string($server, $_POST['question4_answer']);
    $question5_answer = mysqli_real_escape_string($server, $_POST['question5_answer']);

    $query= "INSERT INTO `responses`
             (`time`, `q1`, `q2`, `q3`, `q4`, `q5`, `ipaddr`)
             VALUES ('{$today}', '{$question1_answer}', '{$question2_answer}', '{$question3_answer}', '{$question4_answer}', '{$question5_answer}', '127.0.0.1')";

    if ($query_run = mysqli_query($server, $query)) {
        echo 'success';
    } else {
        echo 'error';
    }
}

答案 2 :(得分：0)

不要计算要通过Ajax发送的数据，只需使用$(FORM_ID).serialize()，其中FORM_ID是选择表单的选择器。 在ajax调用中，此行data: dataString,变为$(FORM_ID).serialize(),

答案 3 :(得分：-2)

您的代码应为

function submit_1() {
        var q1 = document.getElementById("question1_answer").value;
        var q2 = document.getElementById("question2_answer").value;
        var q4 = document.getElementById("question4_answer").value;
        var q5 = document.getElementById("question5_answer").value;

        var q3 = [];
        $('input[type="checkbox"][name="question3_answer[]"]:checked').each(function(){
            q3.push($(this).val());
        })

        var dataPost = {
            question1_answer:  q1, 
            question2_answer: q2, 
            question3_answer: q3, 
            question4_answer: q4, 
            question5_answer: q5
        };

        $.ajax({
            type: "POST",
            url: "php/video_form_process.php",
            data: dataPost,
            cache: false,
            success: function(html) {
                alert(html);
            }
        });
        return false;
    }
相关问题
最新问题