Login form checked with Ajax

Question

Sorry if this is duplicate. I searched a lot, but I can't find any solution to my problem.

I use a CMS system with built in login, but I want to check login detail before sending them to final login file named login.php I have 4 files:

login_form.html
main.js
check_login.php
login.php - build in login script, I did nothing with this file

This is my login_form.html

<div id="login-main" title="Close">
    <div id="login-form" title="">
        <span id="span_close" title="Close">x</span>
        <form class="login-box" id="login-form-final" action="http://localhost/ubytovanie-slovakia.sk/account/login.php" method="post">
            <p>Login</p>
            <input type="hidden" name="username_fieldname" value="username" />
            <input type="hidden" name="password_fieldname" value="password" />
            <p id="login_err"></p>
            <div class="login-line">
                <input type="text" name="username" maxlength="30"/>
                <label>Loginname</label>
            </div>
            <div class="login-line-pass">
                <input type="password" name="password" maxlength="30"/>
                <label>Password ( <a href="#" id="show_lost_pass">Forgot password?</a> )</label>
            </div>
            <div class="login-checkbox-line">
                <input type="checkbox" name="remember" id="remember" value="true"/>
                <label for="remember"><span></span>Remember</label>
            </div>
            <div class="login-submit-line">
                <input type="submit" name="submit" id="login-submit" value="Login"  />
            </div>
        </form>
    </div>
</div>

Here is my JS code:

$('#login-main').live("click",function(e){
        var login_form = $('#login-main').find('*');
        if(!($(e.target).is(login_form))||$(e.target).is('#login-form #span_close')){
            $('#login-main').fadeOut();
        }
        if($(e.target).is('#login-form #login-submit')){
            var login_name = $("#login-form .login-line input").val();
            var login_pwd = $("#login-form .login-line-pass input").val();
            $.post(WB_URL+"/include/ajax/check_login.php", { login_name: login_name, pwd: login_pwd }).done(function(error) {
                switch(error){
                    case '0':
                        $("#login-form-final").submit(function(){
                            return true;
                            alert("submit ready");
                        });
                        break;
                    case '1': 
                        $('#login_err').html('Loginname is empty!');
                        break;
                    case '2':
                        $('#login_err').html('Password is empty!');
                        break;
                    case '3':
                        $('#login_err').html('Wrong loginname or password!');
                        break;
                    case '4':
                        $('#login_err').html('Random error!');
                        break;
                } 
            });
        }
        return false;
    });

and here is check_login.php

require_once('../../config.php');
require_once('../../framework/class.database.php');

if(isset($_POST['login_name'])&& isset($_POST['pwd'])){
    if($_POST['login_name'] == ''){
        $error = '1';
    }else if($_POST['pwd'] == ''){
        $error = '2';
    }else{
        $login_name = test_input($_POST['login_name']);
        $pwd_md5 = md5($_POST['pwd']);
        $q = "SELECT * FROM `".TABLE_PREFIX."users` WHERE `username`='".$login_name."' AND `password`='".$pwd_md5."'";
        $res = $database->query($q);
        if($res->numRows()<1){
            $error = '3';
        }else{
            $error = '0';
        }
    }
}else{
    $error = '4';
}
echo $error;

function test_input($data) {
  $data = trim($data);
  $data = stripslashes($data);
  $data = htmlspecialchars($data);
  return $data;
}

THE PROBLEM :

Everything works fine except if I input good login name and good password. The form doesn't submit. It writes an alert with text "submit ready", so the case:'0' works fine, but the .submit function does not. Can someone help me please?

SOLVED in login_form.html a had input type submit with name="submit". That was the problem :) — Michal Brezany
– Michal Brezany, Commented Mar 12, 2015 at 7:18

Abhisek Malakar · Accepted Answer · 2015-03-02 07:35:43Z

1

I think the problem is if the case is 0 you want to submit the form, in that case, you should use $("#login-form-final").submit(); But you are using the submit handler.Which tell the engine what to do if from some where the form get submitted. I tink which you don't want.

And one more thing is that you are using a statement after return, which will execute never.

answered Mar 2, 2015 at 7:35

Abhisek Malakar

8991 gold badge10 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Michal Brezany Over a year ago

Before this version of code i had: case '0': $("#login-form-final").submit(); break; It doesn´t work. it was same problem. Where do i have statement aftern return? :O

Collectives™ on Stack Overflow

Login form checked with Ajax

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related