RonTheOld
RonTheOld

Reputation: 777

How to get an error to show on the same page rather than new page

Hi guys so I have created a simple login form, however my problem is when I have my errors which pop up , they pop up on a different page, rather than the same page. I would just like them to pop up below the submit button as a simple <p> tag which I will edit in css and make it red etc. However at this time all it does is open a new page and show me the error.

PHP:

    ?php
include 'init.php';
function sanitize($data){
    return mysql_real_escape_string($data);
}
//check if user exists
function user_exists($email){
        $email = sanitize($email);
        return (mysql_result(mysql_query("SELECT COUNT(ID) FROM register WHERE email = '$email'"),0) == 1)? true : false;
}
//check if user has activated account
function user_activate($email){
        $email = sanitize($email);
        return (mysql_result(mysql_query("SELECT COUNT(ID) FROM register WHERE email = '$email' AND active =1"),0) == 1)? true : false;
}
function user_id_from_email($email){
    $email = sanitize($email);
    return (mysql_result(mysql_query("SELECT id FROM register WHERE email = '$email'"),0,'id'));
}
function login($email,$password){
    $user_id = user_id_from_email($email);
    $email = sanitize($email);
    $password = md5($password);

    return (mysql_result(mysql_query("SELECT COUNT(id) FROM register WHERE email = '$email' AND password ='$password'"),0) == 1)? $user_id : false;
}
if(empty($_POST)=== false){
    $email = $_POST['email'];   
    $password = $_POST['password'];
}
if(empty($email)|| empty($password) === true){
    $errors[] = "You must enter a username and a password";  
}
else if(user_exists($email) === false){
    $errors[] = "Email address is not registered";   
}
else if(user_activate($email) === false){
    $errors[] = "You haven't activated your account yet";   
}
else{
    $login = login($email, $password);
    if($login === false){
        $errors[] = "email/password are incorrect";
    } else {
        $_SESSION['user_id'] = $login;
        header('Location: home.php');
        exit();
    }
}
print_r($errors);
    ?>

I tried a simple thing like ; echo"<script>alert('Username or password is incorrect!')</script>"; however this brings a pop up, what I want is an actual p tag to show up on the page, rather than a box.

Upvotes: 0

Views: 61

Answers (2)

Ikari
Ikari

Reputation: 3236

If you can use:

echo"<script>alert('Username or password is incorrect!')</script>";

Then you can define a function like this -

function appendHtml(el, str) {
  var div = document.createElement('div');
  div.innerHTML = str;
  while (div.children.length > 0) {
    el.appendChild(div.children[0]);
  }
}

anywhere in a <script>...</script>.

After that, you just need to use:

echo"<script>appendHtml(document.body, '<p style=\"backround-color: #F00;\">Username or password is incorrect!</p>');</script>";

There in your PHP script!

As simple as that!

Upvotes: 1

Nikolay Traykov
Nikolay Traykov

Reputation: 1695

You can submit the form with an AJAX request. If there is an error, you show the error without reloading the page. Example:

<script type="text/javascript">
   jQuery(document).ready(function() {
       $('#submit-button').on('click', function(e) {
            var form = $('#login-form');
            $.post(form.prop('action'), form.serialize(), function(response) {
                if (response.error) {
                    // show the error wherever you want
                }
            });
            return false;
       });
   });
</script>

Upvotes: 0

Related Questions