Question

I have a big form so for that am using sliding form

http://tympanus.net/Tutorials/FancySlidingForm/

but i need to stop sliding step1 to step2 if mandatory field is empty in step1

for that i had changed function like this

    function validateStep(step) {
            if (step == fieldsetCount) return;

            var error = 1;
            var hasError = false;
            $('#formElem').children(':nth-child(' + parseInt(step) + ')').find(':input:not(button)').each(function () {
                var $this = $(this);
                var valueLength = jQuery.trim($this.val()).length;

                if (valueLength == '') {
                    hasError = true;
                    $this.css('border-color', '#f8bcc2')
// here i added one function 
                    $('#steps').each(function () {
                        //   alert('hhh');
                        marginLeft: '0' + 'px'

                    }
                        );

                    //                $('#steps').css('margin-Left', '0')
                }
                else
                    $this.css('border-color', '#8DC440');
            });

Thanks in advance… if any solutions

Answer 1

When you click check:

[...].click(function(ev){
  var _this=$(this), i = $(this).index(), valid;
  var set=$("#steps formset").get(index-1);
  valid=// Here check set all mandatory field is not empty
  if(valid) $("#steps formset").get(index)/*slide*/
});

Add ‘mandatory’ class to recognize mandatory field.