Jquery Steps Ajax Validation, Laravel

I was wondering if someone could please help me. Im using Jquery Steps with Laravel 5.3. I currently have a form in each section.

When i click next on a section i do a ajax post to the controller method and then that validates and if invalid then it sends json error string back to validate the form.

This works fine if there is an error on the form but if i refresh the page and insert everything correctly and click next (validation returns true) and then i click back and remove content from a required field and click next again, the form doesnt validate. Im not sure why its not validating after a successful attempt the first time.

function validate(form_name,callback) {
var form_validate = $("#"+form_name);

$.ajax({
    async: false,
    cache: false,
    headers: {
      "X-CSRF-TOKEN" : $('meta[name="csrf-token"]').attr('content'),
    },
    type     : "POST",
    dataType: 'json',
    url      : form_validate.attr('action')+'?rand='+Math.random(),
    data     : form_validate.serialize(),
    success  : function(data) {
        form_validate.validate({
            errorElement: 'span',
            errorClass: 'help-block error-help-block',
            errorPlacement: function errorPlacement(error, element) { element.after(error); },
            highlight: function(element) {
                $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
            },
            rules: data.message
        }).settings.ignore = ":disabled,:hidden";

        callback(form_validate.valid());               
    },
    error: function(data) {
        console.log("ERROR");
    }
});        

}

form.steps({
enableContentCache: false,
headerTag: "h3",
bodyTag: "section",
transitionEffect: "slideLeft",
enablePagination: true,
onStepChanging: function (event, currentIndex, newIndex)
{
    // If user click on "Previous" button, we just normally let he/she goes
    if (newIndex < currentIndex) {
        return true;
    }

    if(currentIndex == 0) {
        //Stock Form
        var move = false;
        validate('stock-form',function(bool) {
            move = bool;
        });
        // if(move === false)
        //  $('#stock-form').steps("previous");

        return move;
    }else if(currentIndex == 1) {
        //Accessory Step
        var move = false;
        validate('accessory-form',function(bool) {
            console.log("accessory");
            move = bool;
        });
        return move;
    }else if(currentIndex == 2) {
        //Images Step
        var move = false;
        validate('dropzone-form',function(bool) {
            console.log("images");
            move = bool;
        });
        return move;
    }
},
onStepChanged: function(event, currentIndex, priorIndex) {
    if(currentIndex == 2) {
        console.log("load images");
        // LoadDrop();
    }else if(currentIndex == 3){
        console.log("Summary");
    }
},
onFinishing: function (event, currentIndex)
{
    console.log("Last");
},
onFinished: function (event, currentIndex)
{
    //Summary
    window.location = APP_URL+'/admin/stock/list';
}

});

As you can see, when i click next it grabs a form to validate with ajax. The problem is validation on the next attempt when it was previously successful.

TIA

from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2kE75ZK
via IFTTT