Question

我故意创建一个Ajax函数来读取FORM的输入，创建一个查询字符串并将其发送到PHP文件，该文件将数据插入数据库并发送反馈，指示过程成功或失败。

问题是Ajax XMLHttpRequest.responseText不起作用。这意味着，最终用户不能从php文件获得反馈：如果进程成功或失败。

奇怪的是我发现当我在Ajax函数的末尾放置一个alert（）函数时，XMLHttpRequest.responseText会神奇地开始工作。你可以想象这很烦人，因为它每次运行过程都会创建一个弹出窗口。

有人可以帮助我理解为什么会这样。

// FORM

class Teacher {

    function AddATeacher()
    {   


        ## Template for form with image ##

        echo "<img src='../images/addaTeacher.png' alt='add A teacher icon' align='middle' width='90' height='90' />";
        echo " <b>&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp Add a Teacher </b> <br> <br>";



        ## Template for form with image ##


        echo "<form name ='login' onsubmit='AddATeachers()' method='post'>";        

        echo "First Name: &emsp&emsp&emsp&emsp&emsp <input type='text' size='15' maxlength='15'
              onclick=this.value='' id='teachers_first_name'
              value='Teachers First Name' /> <br>";

        echo "Surname: &emsp&emsp&emsp&emsp&emsp&emsp<input type='text' size='15' maxlength='15'
              onclick=this.value='' id='teachers_surname'
              value='Teachers surname' /> <br>";

        echo "Number: &emsp&emsp&emsp&emsp&emsp &emsp <input type='text' size='15' maxlength='15'
              onclick=this.value=''  id='teachers_number'
              value='Teachers number' /> <br>";

        echo "Email address: &emsp&emsp&emsp&emsp<input type='text' size='15'
              maxlength='25' onclick=this.value='' id='teachers_email'
              value='Email address' /> <br>";

        echo "Password: &emsp &emsp &emsp&emsp&emsp <input type='password' size='15'maxlength='25' 
              id='password' value='' /> <br>";

        echo "<hr/>";

        echo "
            Sex: 
            <select value= 'Male' id='sex'>
            <option> </option>
            <option>Male</option>
            <option>Female</option>
            </select> ";

        echo "  
        Assigned Class:
            <select value= 'Choose a class' id='classes'>
            <option> </option>          
            <option>P1 East</option>
            <option>P1 West</option>
            <option>P2 East</option>
            <option>P2 West</option>
            <option>p3 East</option>
            <option>p3 West</option>
            <option>p4 East</option>
            <option>p4 West</option>
            <option>p5 East</option>
            <option>p5 West</option>
            <option>p6 East</option>
            <option>p6 West</option>
            <option>p7 East</option>
            <option>p7 West</option>
            </select>";

        echo"
        <hr/>
        <input type='submit' value='Submit' /><br />";

        echo "</form>";

    }
}

// AJAX FUNCTION

function AddATeachers(){
    var ajaxRequest;  // The variable that makes Ajax possible!

    try{
        // Opera 8.0+, Firefox, Safari
        ajaxRequest = new XMLHttpRequest();
    } catch (e){
        // Internet Explorer Browsers
        try{
            ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try{
                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e){
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }
    // Create a function that will receive data sent from the server
    ajaxRequest.onreadystatechange = function(){
        if(ajaxRequest.readyState == 4){
            document.getElementById("Ajax_response").innerHTML = ajaxRequest.responseText;
        }
    }

    //alert ("Above ur variables ");
    var teachers_first_name = document.getElementById("teachers_first_name").value;
    //alert ("within ur variables 1111111111 ");
    var teachers_surname = document.getElementById('teachers_surname').value;
    var teachers_number = document.getElementById('teachers_number').value;
    //alert ("within ur variables 222222222 ");
    var teachers_email = document.getElementById('teachers_email').value;
    var password = document.getElementById('password').value;
    //alert ("Email retrieved: " + password + "");
    var tClass = document.getElementById('classes').value;
    var gender = document.getElementById('sex').value;      
    //alert ("Class value: " + tClass + "");    
    //alert ("Exited ur variables ");

    //alert ("Just before Query String...");
    var queryString = "?tFirstName=" + teachers_first_name + "&tSurname=" + teachers_surname + "&tNumber=" + teachers_number + "&tEmail=" + teachers_email + "&tPwd=" + password + "&tSex=" + gender + "&tClass=" + tClass  ;   
    //alert ("After Query String...");

    ajaxRequest.open("GET","addATeacherInsert.php" + queryString, true);
    ajaxRequest.send(null); 
    alert ("Process Complete");
}

// addATeacherInsert.php调用类方法/实例

<?php
require ("database.php");
require ("teacher.class");

mysql_connect(HOSTNAME, USERNAME, PASSWORD) or die(mysql_error());
//echo "Connected to MySQL<br /> <br />";
mysql_select_db(DATABASE) or die(mysql_error());
//echo "Connected to Database: " . DATABASE . " <br />";

$sql = ("SELECT * FROM Teachers_Table WHERE TFirstName='$_GET[tFirstName]' AND TSurName= '$_GET[tSurname]' ");
$query = mysql_query($sql);
$Sample = new Teacher;
$Sample->AddATeacherInsert();

?>

//方法

function AddATeacherInsert()
    {   


        mysql_connect(HOSTNAME, USERNAME, PASSWORD) or die(mysql_error());
        //echo "Connected to MySQL<br /> <br />";
        mysql_select_db(DATABASE) or die(mysql_error());
        //echo "Connected to Database: " . DATABASE . " <br />";

        ##### Insert into Teachers_Table ######
        mysql_query("INSERT INTO Teachers_Table 
        (TFirstName, TSurName, TNumber, TAddress, TPwd, TClassAssig, TSex) VALUES
        ('$_GET[tFirstName]', '$_GET[tSurname]', '$_GET[tNumber]', '$_GET[tEmail]', 
        '$_GET[tPwd]', '$_GET[tClass]', '$_GET[tSex]') ") 

        or die(mysql_error()); 

        ##### Insert into login_details ######
        mysql_query("INSERT INTO login_details 
        (email_address, password) VALUES
        ('$_GET[tEmail]', '$_GET[tPwd]') ") 

        or die(mysql_error()); 

        echo "<br>";
        echo "<center> <img src='../images/approved.png' alt='Enroll student icon' align='bottom' width='90' height='90' /> </center>";

        echo "<br><center> <b> <font color='blue'>" . $_GET[tFirstName] . " " . $_GET[tSurname] . "</b>  has been successfully enrolled...</font></center><br />";      
}

提前谢谢

Answer 1

我没有使用MySQL，但除非MySQL命令引发的任何错误超出了php错误的范围，你可以解释ajaxRequest.status。可以找到不同状态代码的列表here。

Ajax XMLHttpRequest.responseText有条件地工作

1 个答案: