Ajaxform jQuery Plugin

Plugin Official Site:
http://malsup.com/jquery/form/#ajaxForm

Form HTML Example

<form id="iform" name="iform" class="kt-form" action="/b2b/login" method="POST">
	<div class="input-group">
		<input class="form-control" type="text" placeholder="統一編號或身份證" name="account" autocomplete="off">
	</div>
	<div class="input-group">
		<input class="form-control" type="password" placeholder="密碼" name="password">
	</div>
	<div class="row kt-login__extra">
		<div class="col">
			<label class="kt-checkbox">
				<input type="checkbox" name="remember" value="yes"> 記住我
				<span></span>
			</label>
		</div>
		<div class="col kt-align-right">
			<a href="/b2b/forget" id="kt_login_forgot" class="kt-link kt-login__link">忘記密碼?</a>
		</div>
	</div>
	<div class="kt-login__actions">
		<button id="kt_login_signin_submit" class="btn btn-pill kt-login__btn-primary">登入</button>
	</div>

    {{ csrf_field() }}
</form>

Simple Version

$(document).ready(function(){
    $('#iform').lalavalidate();

    $('#iform').ajaxForm({
        dataType: 'json', 
        success: function(data, statusText, xhr, $form){
            //console.log(data);
            if(typeof data.status == 'undefined'){
                alert(data);
            }else if(data.status == 'fail'){
                alert(data.message);
            }else{
                //console.log(data);
                window.location.href = base_url;
            }
        }, 
        error: function(data){
            $('#iform').lalavalidate('show_errors', data);
        }
    });
});

Javascript Example:

$(document).ready(function(){
    $('#iform').lalavalidate();

    $('#iform').ajaxForm({
        dataType: 'json', 
		//Values in data object will be generated in the begining
		//that means value could be empty
        data: {
            cat: selected_nodes()
        }, 
	//If extra data is dynamic, use beforeSubmit instead
	beforeSubmit: function(arr, $form, options) {
            //console.log(arr);
            var param = {
               name: 'category', 
               value: selected_nodes(), 
               type: 'text', 
               required: false
            }

            arr.push(param);
        }, 
        success: function(data, statusText, xhr, $form){
            //console.log(data);
            if(typeof data.status == 'undefined'){
                alert(data);
            }else if(data.status == 'fail'){
                alert(data.message);
            }else{
                //console.log(data);
                window.location.href = base_url;
            }
        }, 
        error: function(data){
            $('#iform').lalavalidate('show_errors', data);
        }
    });

    sample();
});

function selected_nodes(){
    var tree = $("#cat_tree").fancytree("getTree");
    var nodes = tree.getSelectedNodes();
    //console.log(nodes);
    var values = [];
    for(var i = 0; i < nodes.length; i++){
        var node = nodes[i];
        values.push(node.key);
    }
    console.log(values.join(','));
    return values.join(',');
}

function sample(){
    var $c = $('#signup_form');
    set_value('name', 'Rex', $c);
    set_value('pid', 'H155062727', $c);
    set_value('mobile', '0952000000', $c);
    set_value('password', '12345', $c);
    set_value('passwordAgain', '12345', $c);
}

//This function will display errors from laravel validator
function show_response_error(errors){
    var str = '';
    //console.log(errors);

    for(var key in errors){
        var err = errors[key];
        str += err[0] + '\n';
    }
    
    alert(str);
}