JavaScript向PHP发送空参数

Question

I am attempting to create a user area for a website that is accessed by using a username and password. I am using HTML for the front end, JavaScript for the back end and PHP for the server side. I am using Xampp to run a local server and PHPMyAdmin to host the database.

The HTML Code:

<!-- the Login Section -->
    <input type="text" name="userName" placeholder="username" id="usernameBar">
    <input type="password" name="passWord" placeholder="password" id="passwordBar">
    <button id="loginButton" onclick="Login();">Login</button>
    <p id="IncorrectP" title="Incorrect Username or Password" style="display: none">Invalid</p>

JavaScript:

function Login(){

    //Connect to the PHP:
    var urlConnect = "checkLogin1.php";
    //Get the username and password:
    var usrUsername = document.getElementById("usernameBar").value;
    var usrPassword = document.getElementById("passwordBar").value;

    //Define the parameters to send to php
    var strParameters = "usrUsername="+usrUsername + "usrPassword="+usrPassword + "&sid=" + Math.random();

        //Define the options for the AJAX request
        var objOptions = {
        method: "post",
        parameters: strParameters,
        onSuccess: function(objXHR) {

            //If objXHR. responseText = Tenant:
            if(objXHR.responseText=='Tenant'){

                //Go to tenant space:
                alert("Success! (Tenant)");
                OpenTenantPage();

            } 
            //Else if objXHR.responseText = Staff:
            else if(objXHR.responseText=='Staff'){

                //Go to staff space:
                alert("Success! (Staff)");
                OpenStaffPage();

            }
            //Else if objXHR.responseText = Admin:
            else if(objXHR.responseText=='Admin'){

                //Go to admin space:
                alert("Success! (Admin)");
                OpenAdminPage();

            }
            else{

                //Run IncorrectLogin:
                alert("Error! No User Account Found!");
                IncorrectLogin();

            }
        }
    }

    // define the AJAX request object
    var objRequest = new Ajax.Request(urlConnect,objOptions);

}

PHP:

<?php

    //Link the username and password:
    $connect = mysqli_connect("localhost", "admin", "12345", "realestate") or die ('Connection to database failed: ' . mysql_error());
    //Extract variables for request parameters:
    extract($_REQUEST);

    //Try to log in as a tentant:
    $resTenantUser = mysqli_query($connect, "SELECT * FROM tenants WHERE Username='$usrUsername' AND Password='$usrPassword'") or die(mysql_error());
    //$resTenantUser = mysqli_query($connect, "SELECT * FROM tenants WHERE Username='Charb1' AND Password='123456' ") or die(mysql_error());
    //Set intCount to number of rows in result:
    $intCount = mysqli_num_rows($resTenantUser);

    if($intCount == 0){

        echo "Error!";

    }
    else{

        echo "Tenant";

    }

?>

I think that the error my be that the JS is not sending the parameters to the PHP or it is sending empty parameters. I cannot seam to find my mistake though.

Answer 1

parameters必须采用JSON格式，而不是查询字符串格式。如下所示：
parameters:{usrUsername: usrUsername , usrPassword:usrPassword , sid : Math.random()}

Answer 2

Problem is in the query params. You missed & . Try this way.

var strParameters = "usrUsername="+usrUsername + "&usrPassword="+usrPassword + "&sid=" + Math.random();

Or

var strParameters = {"usrUsername" : usrUsername, "usrPassword" : usrPassword, "sid" : Math.random()}