jQuery Ajax未运行错误

Question

我正在尝试通过jQuery将表单数据发布到PHP。下面是代码。

-HTML表单

<div id="createQuestionBlock">
    <form id="createQuestionForm" action="" method="POST">
        Question Code: <input id="code" class="createQuestionTextBox1" type="text" name="questionCode"><span id="invalid_1"></span><br>
        Question Name: <input id="question" class="createQuestionTextBox1" type="text" name="questionName"><span id="invalid_2"></span><br>
        Correct Answer: <input id="answer" class="createQuestionTextBox1" type="text" name="correctAnswer"><span id="invalid_3"></span><br>
        Option 1: <input id="option1" class="createQuestionTextBox2" type="text" name="option_1"><span id="invalid_4"></span><br>
        Option 2: <input id="option2" class="createQuestionTextBox2" type="text" name="option_2"><span id="invalid_5"></span><br>
        Option 3: <input id="option3" class="createQuestionTextBox2" type="text" name="option_3"><span id="invalid_6"></span><br>
        Option 4: <input id="option4" class="createQuestionTextBox2" type="text" name="option_4"><span id="invalid_7"></span><br>
        Option 5: <input id="option5" class="createQuestionTextBox2" type="text" name="option_5"><span id="invalid_8"></span><br>
        <span id="quizCreated"></span>
        <input type="Submit" id="questionSubmit" value="Create Question"></input>   
    </form>
</div>

function SubmitFormCreationData() {
$("#createQuestionForm").submit(function(e) {
    e.preventDefault();

    alert("check1");

    $.ajax({
        url: 'InsertNewQuestion.php',
        data: $("#createQuestionForm").serialize(), 
        dataType: 'json',
        success: function(data) {
            alert("check2");

            var infoCorrect = data.infoCorrect;

            if (infoCorrect == 0) {
                alert("Quiz Created");
                window.setTimeout(delay,2000);
                return true;
            } else if (infoCorrect == 1) {
                $("#invalid_1").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else if (infoCorrect == 2) {
                $("#invalid_2").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else if (infoCorrect == 3) {
                $("#invalid_3").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else if (infoCorrect == 4) {
                $("#invalid_4").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else if (infoCorrect == 5) {
                $("#invalid_5").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else if (infoCorrect == 6) {
                $("#invalid_6").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else if (infoCorrect == 7) {
                $("#invalid_7").text(" Invalid!").show().fadeOut(2000);
                return false;
            } else {
                $("#invalid_8").text(" Invalid!").show().fadeOut(2000);
                return false;
            }    
        }
    });

    alert("check3");
});
}

<?php
$con = mysql_connect("localhost","root","");

if (!$con) 
    die("ERROR: ".mysql_error());                   

$db_con = mysql_select_db("QuestionsDatabase",$con);

if (!$db_con) 
    die("ERROR: ".mysql_error());

$questionCode = $_POST['questionCode'];
$questionName = $_POST['questionName'];
$correctAnswer = $_POST['correctAnswer'];
$option_1 = $_POST['option_1'];
$option_2 = $_POST['option_2'];
$option_3 = $_POST['option_3'];
$option_4 = $_POST['option_4'];
$option_5 = $_POST['option_5']; 

$infoCorrect = 0;

if (CheckCodeField($questionCode) == false)
    $infoCorrect = 1;
else if (CheckQuestionAnswerField($questionName) == false)
    $infoCorrect = 2;
else if (CheckCorrectAnswerField($correctAnswer) == false)
    $infoCorrect = 3;
else if (CheckQuestionAnswerField($option_1) == false)
    $infoCorrect = 4;
else if (CheckQuestionAnswerField($option_2) == false)
    $infoCorrect = 5;
else if (CheckQuestionAnswerField($option_3) == false)
    $infoCorrect = 6;
else if (CheckQuestionAnswerField($option_4) == false)
    $infoCorrect = 7;
else if (CheckQuestionAnswerField($option_5) == false)
    $infoCorrect = 8;

if ($infoCorrect == 0) {
    $rowIDList = mysql_query("SELECT rowID FROM questions");

    $currentGreatestRowID = -1;

    $rowCount = 1;

    while($row1 = mysql_fetch_assoc($rowIDList)) {
        if ($currentGreatestRowID < $row1['rowID']) {
            $currentGreatestRowID = $row1['rowID'];
        }

        $rowCount++;  
    }   

    $currentRowID = $currentGreatestRowID+1;


    $sql = "INSERT INTO questions (rowID,questionCode,questionName,option_1,option_2,option_3,option_4,option_5,option_1_votes,option_2_votes,option_3_votes,option_4_votes,option_5_votes,correctAnswer,pollingStatus) 
    VALUES (".$currentRowID.",".$questionCode.",'".$questionName."','".$option_1."','".$option_2."','".$option_3."','".$option_4."','".$option_5."',0,0,0,0,0,".$correctAnswer.",0)";

    if (mysql_query($sql,$con)) {
        echo "Inserted values";
    }
    else {
        echo ("Could not insert values: ". mysql_error());
    }
}

/*echo "| ".false." | "."0 | ";
echo "CheckCodeField(questionCode) = ".CheckCodeField($questionCode).", ";
echo "CheckQuestionAnswerField(questionName) = ".CheckQuestionAnswerField($questionName).", ";
echo "CheckCorrectAnswerField(correctAnswer) = ".CheckCorrectAnswerField($correctAnswer).", ";
echo "CheckQuestionAnswerField(option_1) = ".CheckQuestionAnswerField($option_1).", ";
echo "CheckQuestionAnswerField(option_2) = ".CheckQuestionAnswerField($option_2).", ";
echo "CheckQuestionAnswerField(option_3) = ".CheckQuestionAnswerField($option_3).", ";
echo "CheckQuestionAnswerField(option_4) = ".CheckQuestionAnswerField($option_4).", ";
echo "CheckQuestionAnswerField(option_5) = ".CheckQuestionAnswerField($option_5).", ";
echo "infoCorrect = ".$infoCorrect;*/

$items = array('infoCorrect'=>$infoCorrect);

json_encode($items);    

mysql_close($con);

//-----------------functions--------------
function CheckCodeField($value) {
    $isCodeValid = true;

    if (is_numeric($value) == false)
        $isCodeValid = false;
    if ($value < 100000)
        $isCodeValid = false;
    if ($value > 999999) 
        $isCodeValid = false;

    return $isCodeValid;
}

function CheckQuestionAnswerField($value) {
    $isQAValid = true;

    if($value == "")
        $isQAValid = false;
    if($value == null)
        $isQAValid = false;
    for($LCV=0; $LCV<(count($value)-1); $LCV++) {
        if($value[$LCV] = "'")
            $isQAValid = false;
        if($value[$LCV] = '"')
            $isQAValid = false;
    }

    return $isQAValid;
}

function CheckCorrectAnswerField ($value) {
    $isAnswerValid = true;

    if (is_numeric($value) == false)
        $isAnswerValid = false;
    if ($value < 1)
        $isAnswerValid = false;
    if ($value > 5) 
        $isAnswerValid = false;

    return $isAnswerValid;
}
//----------------------------------------

?>

现在的问题是，我可以看到第一个警报(“check1”)和第二个警报(“check3”)，但是我看不到警报(“check2”)，所以我假设错误出现在ajax表单中。我试着直接从html页面运行php文件，它工作正常。哪里出了问题？

-after编辑--

因此，我查看了json encode在更改回显json encode后发送的信息。这是发送的信息{"infoCorrect":1}。不应该

else if (infoCorrect == 1) {
    $("#invalid_1").text(" Invalid!").show().fadeOut(2000);
    return false;
}

从infoCorrect为1开始运行。

--编辑2-------------------------------------------------------------------------------------------------------后下面是我如何调用上面所示的SubmitFormCreationData()函数。

$(document).ready(function() {
     jQueryInitialization();

    ButtonsHandling();

    SubmitFormCreationData();

    setInterval(function() {UpdateData()}, 500);
 });

-上次编辑(找到SOLUTION)---------------------------

以下是答案中提到的解决方案的代码。这不是一个真正的解决方案，而是一个变通办法。我使用post而不是ajax，它起作用了。还要确保您的jQuery文件是最新的。

function SubmitFormCreationData() {
$("#createQuestionForm").submit(function(e) {
    e.preventDefault();

    $.post("InsertNewQuestion.php", $("#createQuestionForm").serialize()).success(function(data) {
        var infoCorrect = data.infoCorrect;

        if (infoCorrect == 0) {
            alert("Quiz Created");
            window.setTimeout(delay,2000);
            return true;
        } else if (infoCorrect == 1) {
            $("#invalid_1").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else if (infoCorrect == 2) {
            $("#invalid_2").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else if (infoCorrect == 3) {
            $("#invalid_3").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else if (infoCorrect == 4) {
            $("#invalid_4").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else if (infoCorrect == 5) {
            $("#invalid_5").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else if (infoCorrect == 6) {
            $("#invalid_6").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else if (infoCorrect == 7) {
            $("#invalid_7").text(" Invalid!").show().fadeOut(2000);
            return false;
        } else {
            $("#invalid_8").text(" Invalid!").show().fadeOut(2000);
            return false;
        }        
    });
});
}

Answer 1

请参阅问题中的最终编辑。

Answer 2

如果将dataType设置为json，则整个响应必须是有效的json字符串，但是在json之前回显文本，这将导致jQuery产生错误。

if (mysql_query($sql,$con)) {
    echo "Inserted values";
}

删除回显，将任何消息放入json响应中，并确保输出json (echo json_encode($items);)。

Answer 3

您必须echo出json：

echo json_encode($items);