How to add custom Javascript/Jquery validation for multi-step form?

Control behavior of Next button:

I have a multi step form.

And  I did add custom jquery code to my form in order to add custom validation to first step. 

In first step, I have just one field and when I click  "next" button, I call my custom javascript/jquery code.

So if my custom validation succeeds, I want the form to goto next step.

But if it fails, I want the form to stay in step1 itself.

The way it works now, success/failure, it goes to next step. 

So basically, How can I control behavious of Next button using custom javascript/jquery code? 

Please point to javascript/jquery examples that does the same as explained above.

Thanks

Hello oldpc,

The only way to add custom Javascript/JQuery code to the form is to use your form source code:

How-to-get-the-Full-Source-Code-of-your-Form 

Note that embedding custom Javascript to your form in the form builder is not possible. It will be stripped off for security reasons. So, if you want custom validations, we suggest to implement it in your form source code. 

Note that every time you change (add or remove fields) from your form in the form builder, you must update the form codes on your site by re-embedding the form.

But, I believe most of the features you're looking for is available in the form builder. For example, for checking custom validations, I suggest taking advantage of the option to add conditional statements:

Smart-Forms-Using-Conditional-Logic

How-to-Enable-Disable-Fields-Using-Conditional-Logic

If there are specific features you're looking for, we can submit that as a feature request but take note that requests have priorities depending on the no. of users requesting them.

Hope this information helps! But, let us know if you need further assistance.

Hi Victoria:

"the only way to add custom Javascript/JQuery code to the form is to use your form source code:"

Perhaps i did not mention it in my last post. Yes. This is how I achieved it. 

And it was how I able to add custom javascript code.jquery.

That is not the issue. Now please read my question below again.

===================================

Control behavior of Next button:

I have a multi step jotform  form. I took source code and added to my own html file and then  I wsa able to add custom jquery code for custom validation to first step of the form. 

In first step, I have just one field and when I click  "next" button, I call my custom javascript/jquery code.

So if my custom validation succeeds, I want the form to goto next step.

But if it fails, I want the form to stay in step1 itself.

The way it works now, success/failure, it goes to next step. 

So basically, How can I control behavious of Next button using custom javascript/jquery code? 

Please point to javascript/jquery examples that does the same as explained above.

I am sure this is something other users also will find useful.

Since our web builder does not accept JavaScript or jQuery, we do not have any examples.  If you are looking to further customize it, you may hire a front-end developer who can build your custom script code according to your requirements.