Hey Everyone,

I am trying to create login page where if the user doesn't enter a value into the username and password textfields a box fades in (JQuery function) telling the user to enter info. I know I can just add the required = "required" to the input tag, but adding the fade in box will help me in adding future functionality.

What I need to do:
When the user click the "login" this happens-

<?php

session_start();

if ($_POST["uName"] != "" && $_POST["uPass"] != "") {
    $_SESSION['userName'] = $_POST["uName"];
    $_SESSION['password'] = $_POST["uPass"];

    header("Location: pg2_profile.php");
} else {
    $_SESSION['redirect'] = "true";
    header("Location: ../index.php");
}
?>

If the info is good (for now the info just need to be there, later the sql database will be added) the user is redirected to the next page. If nothing is present the user is sent to the home page.

I would like that when the user is redirected to the front page a JQuerry event display a <div> telling the user to enter information into the boxes. Is this possible? Can PHP trigger a JQuery event? If not how can I implement this using JS.

Thanks

Recommended Answers

All 6 Replies

post your jQuery function code here. the one you want code up with php

You can use jquery to create a new ajax call and check input values.. if values are null or empty return from php with error message.

This is just one way of doing it.

$(document).ready(function(){
    $("#button").on('click',function(){
            var name = $('#name').val();
            var email= $('#email').val();
            var data = 'name=' + name + '&email=' + email;

            $.ajax({
                url: 'login_processor.php',
                type: "POST",
                data: data,
                cache: false,
                dataType: "JSON",
                success: function(data){
                    if(data.error_name){
                        alert(data.error_name);
                        return false;
                    }
                    if(data.error_email){
                        alert(data.error_email);
                        return false;
                    }
                }
            });
        });
    });





//login_processor.php

    $error_name = null;
    $error_email = null;

    if(empty($_POST['name'])){
        $error_name = 'Please Enter Name!';
    }

    if(empty($_POST['email'])){
        $error_email = 'Please Enter Email!';
    }

    echo json_encode(array('error_name'=>$error_name, 'error_email' => $error_email));

This is very simple and basic but you can get the point..... instead of alert you can use jquery to show the fade in function.

Of course,you can always call JS from PHP.Since the POST method points to the same page,use something like this

$yourJS = '<script type="text/javascript">
                window.onload = dothis();
                function dothis(){
                    alert("I believe you have something to say to the world");
                    //Replace the above code with anything you want.Just make sure you escape any single quotes
                }
           </script>';

echo $yourJS;

//It would be better if you use heredoc.Look up the PHP documentation for more info.
//You wouldn't have to escape anything then
Member Avatar for diafol

You seem to have a dedicated login page. Most modern sites have dropdown or popup login forms that can be accessed from every public page. Unless you have a completely member-view site, perhaps that could be a way to go?

If you do this, the form (an include file) will send either via vanilla php or via ajax to a loginhandler script (separate file). The data is processed (checked with the DB) and then you assign a sesson variable to keep track of login status and access rights. You then header() back to the calling page where the login|register link should be changed to something like 'Username' along with with a logout link. My 2p

Awesome stuff guys. delta_frost had the answer I was looking for.
A new problem arises: I have the page using a session variable redirect when the redirect is set to true the menu drops and all goes as plan.
However, when I go to the webpage without being redirected a PHP error is thrown and is not removed untill the redirect varaible is set to null.

This is because of the <?php session_destroy(); ?> code at the bottom. The destroy assures that the notification div doesnt drop. How can I make the error message disapear?

Got that answer to my last question. I simple turned off the error reporting ( error_reporting(0) ) in the PHP code and the page look normal.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.