Question

I’m using WAMP on a project and am having some difficulties. Basically, I want to click a form submit button which calls a function which requests some data in php.
My functions

/**********************************************************************************/
//USER LOG IN
$('#cSignIn').click(function(){
    //Get User name and password

    var uname = $('#uName').val();
    var pword = $('#pWord').val();

    loginRequest(uname, pword);

    $('.formList').hide();
    $('#information').show();
    return false;   
});

//LOGIN REQUEST
function loginRequest(uName, pWord){
    if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
             xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("rText").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","login.php?Username=" + uName +"&Password=" + pWord ,true);
    xmlhttp.send();

    return false;
} 

When I try to return the value of rText (my div) using $(‘#rText’).val(); OR $(‘#rText’).text(); it is not what I’m expecting it to be. The php code echos a number, the code for login.php is follows

<?php
$con = mysql_connect("localhost:3306","root","");
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }
mysql_select_db("Library", $con);

$username=$_GET["Username"];
$password=$_GET["Password"];
$result = mysql_query("SELECT * FROM Customers");
$success = 0;

while($row = mysql_fetch_array($result))
  {
    if($username==$row['Username']) 
        if($password==$row['Password']) 
            if($row['Admin'] == true)
            {
                $success = 1;
            }
            else
            {
                $success = $row['Id'];
            }

  }
echo $success;

mysql_close($con);
?> 

Again, when I check the value of rText in either of the functions involved, the value is not expected. However, when I exit the function the value is valid.

How can I have the correct value in rText right after the return from function loginRequest?

Answer 1

First, you can not use $(‘#rText’).val() for a Div, only Form inputs, you should use $(‘#rText’).html() instead

Second, to make your life easier…you can widdle down your Login Request function quite a bit using ajax. Trust me, its not hard to get a grasp of. Here all you need to make an ajax request.

//LOGIN REQUEST
function loginRequest(uName, pWord) {


    $.ajax({
        type: "POST", //Post or Get
        url: "/login.php", //PHP page to post to
        data: "Username=" + uName +"&Password=" + pWord, // The values you want to send along to PHP Page
        dataType: "script", // This allows your PHP echo to be actual Javascript / Jquery

     });        
}

And your PHP success functions would be this

while($row = mysql_fetch_array($result))
  {
    if($username==$row['Username'])
        if($password==$row['Password'])
            if($row['Admin'] == true)
            {
                $success = "$('#rText').html('1')"; //Echo as Jquery
            }
            else
            {
                $success = "$('#rText').html('" + $row['Id'] + "')"; // Echo as Jquery
            }

  }
echo $success;

Easy enough right??