Handling Login Form Validation

Question

I'm trying to figure out how I should use the login form submission to validate the user login credentials. With this template I have it includes a javascript validation code however I do have my own validation code on the server side I want to use (php). After it goes through the php validation I want it to redirect to either the login form again if there was a problem validating the login OR redirect to the dashboard if there was a successful login.

JS validation:

$(window).load(function(){
/*
 * Validate the form when it is submitted
 */
var validatelogin = $("form").validate({
    invalidHandler: function(form, validator) {
        var errors = validator.numberOfInvalids();
        if (errors) {
            var message = errors == 1
              ? 'You missed 1 field. It has been highlighted.'
              : 'You missed ' + errors + ' fields. They have been highlighted.';
            $('.box .content').removeAlertBoxes();
            $('.box .content').alertBox(message, {type: 'warning', icon: true, noMargin: false});
            $('.box .content .alert').css({
                width: '',
                margin: '0',
                borderLeft: 'none',
                borderRight: 'none',
                borderRadius: 0
            });
        } else {
            $('.box .content').removeAlertBoxes();
        }
    },
    showErrors : function(errorMap, errorList) {
            this.defaultShowErrors();
            var self = this;
            $.each(errorList, function() {
                var $input = $(this.element);
                var $label = $input.parent().find('label.error').hide();
                $label.addClass('red');
                $label.css('width', '');
                $input.trigger('labeled');
                $label.fadeIn();
            });
    },
    submitHandler: function(form) {
        window.location.replace('dashboard.html');
    }
});
});

Controller:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Usermanagement extends CI_Controller { 

public function __construct()
{
    parent::__construct();
}   

public function index()
{
    //Config Defaults Start
    $msgBoxMsgs = array();//msgType = dl, info, warn, note, msg
    $cssPageAddons = '';//If you have extra CSS for this view append it here
    $jsPageAddons = '';//If you have extra JS for this view append it here
    $metaAddons = '';//Sometimes there is a need for additional Meta Data such in the case of Facebook addon's
    $siteTitle = '';//alter only if you need something other than the default for this view.
    //Config Defaults Start


    //examples of how to use the message box system (css not included).
    //$msgBoxMsgs[] = array('msgType' => 'dl', 'theMsg' => 'This is a Blank Message Box...');

    /**********************************************************Your Coding Logic Here, Start*/

    if(!$this->session->userdata('logged_in'))
    {
        $bodyContent = "login";//which view file
    }
    else
    {
        $bodyContent = "cpanel/index";//which view file
    }

    $bodyType = "full";//type of template

    /***********************************************************Your Coding Logic Here, End*/

    //Double checks if any default variables have been changed, Start.
    //If msgBoxMsgs array has anything in it, if so displays it in view, else does nothing.      
    if(count($msgBoxMsgs) !== 0)
    {
        $msgBoxes = $this->msgboxes->buildMsgBoxesOutput(array('display' => 'show', 'msgs' =>$msgBoxMsgs));
    }
    else
    {
        $msgBoxes = array('display' => 'none');
    }

    if($siteTitle == '')
    {
        $siteTitle = $this->metatags->SiteTitle(); //reads 
    }

    //Double checks if any default variables have been changed, End.

    $this->data['msgBoxes'] = $msgBoxes;
    $this->data['cssPageAddons'] = $cssPageAddons;//if there is any additional CSS to add from above Variable this will send it to the view.
    $this->data['jsPageAddons'] = $jsPageAddons;//if there is any addictional JS to add from the above variable this will send it to the view.
    $this->data['metaAddons'] = $metaAddons;//if there is any addictional meta data to add from the above variable this will send it to the view.
    $this->data['pageMetaTags'] = $this->metatags->MetaTags();//defaults can be changed via models/metatags.php
    $this->data['siteTitle'] = $siteTitle;//defaults can be changed via models/metatags.php
    $this->data['bodyType'] = $bodyType;
    $this->data['bodyContent'] = $bodyContent;
    $this->load->view('usermanagement/index', $this->data);
}

function login()
{
    $this->form_validation->set_rules('username', 'Username', 'trim|required|max_length[50]|xss_clean');
    $this->form_validation->set_rules('password', 'Password', 'trim|required|max_length[12]|xss_clean');

    if ($this->form_validation->run() == FALSE)
    {
        $this->index();
    }
    else
    {
        $username = $this->input->post('username');
        $password = $this->input->post('password');

        $user_id = $this->loggedin->check_login($username, $password);

        if(! $user_id)
        {
           redirect('/'); 
        }
        else
        {
            $this->session->set_userdata(array(
                'logged_in' => TRUE,
                'user_id' => $user_id
            ));
            redirect('cpanel/index');
        }
    }
}

function logout()
{
   $this->session->sess_destroy();
   $this->index();
}       

}

/* End of file usermanagement.php */ 
/* Location: ./application/controllers/usermanagement.php */ 

Any ideas?

Answer 1

I think your question is to how to detect the validation of logged user if I understood correctly. In the CodeIgniter controller function you can just examine it and echo it with a code to understand it in client-side(JavaScript). For example return something like this:

if(valid){
  echo "1, You're logged in successfully"; 
}

Then you can split it in the JS and use the code and message part.

For navigation with JS use:

window.location.href = 'yourlocation';

If your question is related to how to get the CI function and use it in jQuery ajax, I can tell you that you can use it just like the old times. url: 'yourrootfolder/yourcontroller/yourfunction'

Hope this help.