Login issue using php, lightbox and javascript
Results 1 to 8 of 8

Thread: Login issue using php, lightbox and javascript

  1. #1
    Junior Member
    Join Date
    Dec 2012
    Posts
    8

    Exclamation Login issue using php, lightbox and javascript

    Hello everyone,

    I have this idea for a website that I can't seem to solve. I created an intro page where there's a username and a password to type and two buttons, a login button and a register button.
    What I wanted to do is when the login button is pressed it compares the username and the password with database entries, if they're available, it would redirect the client to homepage. If not, the lightbox would appear for registration.
    When both buttons are click, nothing happens :/..


    The code to my intro page is:



    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title> RYNC - Rent Your Car Now</title>
    <style type="text/css">
    @import "Dialog/DescriptionDialog.css";
    @import "Dialog/styles.css";
    </style>
    <style>
    body {
    background: url(../Images/Bgcolor.jpg);
    background-size: 100%;
    background-position: top center;
    background-repeat: no-repeat;
    }
    </style>
    </script>
    <script type="text/javascript" src="JQuery.js"></script>
    <script type="text/javascript" src="Dialog/jquery.lightbox_me.js"></script>

    <?php
    function ShowLogin(){
    $f_usr = $_POST["username"];
    $f_pswd = $_POST["password"];
    $con=mysql_connect("localhost","root","");

    if(! $con){
    die('Connection Failed'.mysql_error());
    }

    mysql_select_db("projet",$con);
    $result = mysql_query("SELECT * FROM client WHERE username= '" .$f_usr. "' AND password= '" .$f_pswd. "' ");
    $numrows=mysql_num_rows($result);

    if ($numrows != 0){
    header("Location: Homepage.php");}
    else{
    ShowRegistration();}
    }

    ?>


    <script type="text/javascript">
    function ShowRegistration(){
    .get("Registration.php",
    function(data){
    $("#descDialog").empty();
    $("#descDialog").append(data);

    $("#descDialog").lightbox_me({
    centered:true
    });
    })
    }

    </script>
    </head>




    <body>
    <form name="frm" action="Registration.php" method="post">
    <center>
    <OBJECT classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000"
    codebase="http://download.macr...ersion=6,0,0,0"
    WIDTH="640" HEIGHT="480" id="RYNC" ALIGN="">
    <PARAM NAME=movie VALUE="RYNC.swf">
    <PARAM NAME=quality VALUE=high>
    <PARAM NAME=bgcolor VALUE=#FFFFFF>
    <EMBED src="../Flash/RYNC.swf" quality=high bgcolor=#FFFFFF WIDTH="640" HEIGHT="480" NAME="RYNC" ALIGN="" TYPE="application/x-shockwave-flash"
    PLUGINSPAGE="http://www.macromedi...layer"></EMBED>
    </OBJECT>

    <br>
    Username
    <input type="text" value="" name="username">
    <br>
    Password
    <input type="password" value="" name="password">
    <br>
    </form>
    <input type="button" value="Log In" name="Login" onclick="<? ShowLogin(); ?>">
    <input type="button" value="Register now" name="Register" onclick="ShowRegistration();">
    <div id="descDialog"></div>
    </body>
    </html>

    Thanks in advance

    Regards,
    Chris

  2. #2
    Settled 4 red convertible dalecosp's Avatar
    Join Date
    Jul 2002
    Location
    Accelerating Windows at 9.81 m/s....
    Posts
    7,621
    Hello Chris, and welcome to PHPBuilder!

    Please help us out by using [code][/code] or [php][/php] around your code excerpts ... it simplifies page navigation and (in the case of PHP) can assist with debugging due to syntax highlighting.

    Your code contains some problems. Your design may, also, contain some problems. For example, you say that this is the code for your login page. Yet, I see the authentication code as well, and a PHP header() call after what appears to be the <head> section of an HTML page. It could be that your design for the system has a flaw in its logical flow.

    You say "clicking doesn't produce any effect" ... Do you have any further information that could tell us what IS working and/or happening? Perhaps you could examine your server's error logs, or Firebug/Chrome debugger's error console, and see if there are any specific errors we could help with?
    /!!\ mysql_ is deprecated --- don't use it! Tell your hosting company you will switch if they don't upgrade! /!!!\ ereg() is deprecated --- don't use it!

    dalecosp "God doesn't play dice." --- Einstein "Perl is hardly a paragon of beautiful syntax." --- Weedpacket

    Getting Help at All --- Collected Solutions to Common Problems --- Debugging 101 --- Unanswered Posts --- OMBE: Office Machines, Business Equipment

  3. #3
    Junior Member
    Join Date
    Dec 2012
    Posts
    8
    First of all thanks a lot for replying, I really apperciate that you took the time to help me out and sorry for any inconvenience.

    Ok let me explan a little bit more.
    In the beginning, I wasn't using the function in the same page.
    In the initial page I had in Intro.php :

    Code:
    <head>
    		<style type="text/css">
    			@import "Dialog/DescriptionDialog.css";
    			@import "Dialog/styles.css";
    		</style>
    		<style>
    		<script type="text/javascript" src="JQuery.js"></script>
    		<script type="text/javascript" src="Dialog/jquery.lightbox_me.js"></script>
    		<script type="text/javascript" src="intro.js"></script>
        </head>
    
    <input type="button" value="Log In" name="Submit" onclick="ShowLogin();">
    <div id="descDialog"></div>
    then in intro.js:

    Code:
    function ShowLogin(){
    				$.get("Registration.php",
    				function(data){
    				$("#descDialog").empty();
    					$("#descDialog").append(data);
    					
    					$("#descDialog").lightbox_me({
    						centered:true
    					});
    				})
    			}
    So the light box was working just fine. But I needed to do the authentification for the username and password and didn't know what to do so I wrote the code above..

    Really apperciate the help!

  4. #4
    Settled 4 red convertible dalecosp's Avatar
    Join Date
    Jul 2002
    Location
    Accelerating Windows at 9.81 m/s....
    Posts
    7,621
    Well, authentication is kind of like gaining entry to a high-brow party. You give your name (credentials), the maitre'd checks the guest list and tells you if you can enter or not.

    To do this on the web, you have to submit a form, get a response from the server, and then go to the appropriate location.

    The "standard" way to handle this, prior to a few years ago, was to present an HTML login form, have that form submitted to a handler script, and have the handler tell the browser where to go (in this case, to the homepage, or to a registration page).

    If you've never written an authentication system before, I'd recommend you try the standard way first.

    The plan that you seem to have in mind appears to me to be a more advanced concept; that is, a form appears on the page, pushing the button contacts the server without re-loading the page and, depending on the result of the authentication attempt you will either send the browser to a new location or present another form. If you want to do this, you are going to be very careful in planning your application, and you really need to know what each technology (HTML, PHP, Javascript, and for the purposes of this example, "AJAX") can do to help you meet your goal.

    For one thing, you'll not be able to use PHP's header() function to redirect the browser after an authentication attempt unless the page gets re-loaded ... a system like I think you are attempting to create would have to use Javascript to accomplish this redirection.
    /!!\ mysql_ is deprecated --- don't use it! Tell your hosting company you will switch if they don't upgrade! /!!!\ ereg() is deprecated --- don't use it!

    dalecosp "God doesn't play dice." --- Einstein "Perl is hardly a paragon of beautiful syntax." --- Weedpacket

    Getting Help at All --- Collected Solutions to Common Problems --- Debugging 101 --- Unanswered Posts --- OMBE: Office Machines, Business Equipment

  5. #5
    Junior Member
    Join Date
    Dec 2012
    Posts
    8
    I'm doing the authentication with the code below:


    PHP Code:
    <?php
     
            $f_usr 
    $_POST["username"];
            
    $f_pswd $_POST["password"];
            
    $con=mysql_connect("localhost","root","");
            
            if(! 
    $con){
                die(
    'Connection Failed'.mysql_error());
            }
     
            
    mysql_select_db("projet",$con);
            
    $result mysql_query("SELECT * FROM client WHERE username= '" .$f_usr"' AND password= '" .$f_pswd"' ");
            
    $numrows=mysql_num_rows($result);
            
            if (
    $numrows == 0){
                
    header("Location: Registration.php");}
        
        
    ?>
    and it works fine alone. Does it mean that i can combine the lightbox and this code together?

  6. #6
    Settled 4 red convertible dalecosp's Avatar
    Join Date
    Jul 2002
    Location
    Accelerating Windows at 9.81 m/s....
    Posts
    7,621
    If your login form is a separate page, you could have it point to this and put the registration part last, after the header() call; just make sure that any HTML output comes after the code above. This would include whitespace, any echo() or print() statements in PHP, HTML tags, and, of course, the JS needed for the lightbox effect.
    /!!\ mysql_ is deprecated --- don't use it! Tell your hosting company you will switch if they don't upgrade! /!!!\ ereg() is deprecated --- don't use it!

    dalecosp "God doesn't play dice." --- Einstein "Perl is hardly a paragon of beautiful syntax." --- Weedpacket

    Getting Help at All --- Collected Solutions to Common Problems --- Debugging 101 --- Unanswered Posts --- OMBE: Office Machines, Business Equipment

  7. #7
    Junior Member
    Join Date
    Dec 2012
    Posts
    8
    Sorry for the late reply but I've been busy with other projects.
    Anws, I think I understand what you mean but I don't know how to do it in my code

    I put the code of the lightbox in an other page and saved it as a javascript file "intro.js"

    Code:
    function ShowRegistration(){
    				$.get("Registration.php",
    				function(data){
    				$("#descDialog").empty();
    					$("#descDialog").append(data);
    					
    					$("#descDialog").lightbox_me({
    						centered:true
    					});
    				})
    			}

    but can I put the authentication in another function there too or will it not work properly? cause I already tried it and it sort of ruined the hole code (the lightbox wont appear any more upon clicking the register button)


    Thanks again for your help I really appreciate it

  8. #8
    Un Re Member cretaceous's Avatar
    Join Date
    Sep 2004
    Location
    London UK
    Posts
    934
    It seems as if you are mixing javascript with PHP - but they are two totally different beasts.
    PHP happens on the webserver.
    Javascript happens in the user's web browser.

    As Dalecosp said.. as you are sticking with the 'simple' process, keep PHP and js separate

    It's perfectly fine to put your log in form in the chunk of html that appears via the lightbox and when it gets submitted a bit of PHP will run on the webserver and perform the log in checks...
    Last edited by cretaceous; 12-13-2012 at 12:30 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •