same question.
We are not an extension of StackOverflow. If you have a question, please at least have the courtesy to paste your question into this forum.
i’am using https://www.jqueryscript.net/demo/image-puzzle-slider-captcha/ for a form, i need to make sure the fields are correct before it submits. Right now it just get stuck (the puzzle) if i press the button submit when the field{s} have not been filled.
If all the fields are ok, it submits fine.
<h2>Contact Form</h2>
<form id="contact-form" action="" method="post">
<input autocomplete="off" type="text" id="website" name="website"/>
<label class="name">
<input type="text" placeholder="Name:" data-constraints="@Required @JustLetters" />
<span class="empty-message">*This field is required.</span>
<span class="error-message">*This is not a valid name.</span>
</label>
<label class="email">
<input type="text" placeholder="E-mail:" data-constraints="@Required @Email" />
<span class="empty-message">*This field is required.</span>
<span class="error-message">*This is not a valid email.</span>
</label>
<label class="phone">
<input type="text" placeholder="Phone:" data-constraints="@Required @JustNumbers"/>
<span class="empty-message">*This field is required.</span>
<span class="error-message">*This is not a valid phone.</span>
</label>
<label class="message">
<textarea placeholder="Message:" data-constraints='@Required @Length(min=20,max=999999)'></textarea>
<span class="empty-message">*This field is required.</span>
<span class="error-message">*The message is too short.</span>
</label>
<br>
<script>
$('#captcha').sliderCaptcha({
repeatIcon: 'fa fa-redo',
onSuccess: function () {
//if form fields are OK submit.
document.getElementById('submit').click();
//if not ok, reset the slider.
}
});
</script>
https://www.jqueryscript.net/demo/image-puzzle-slider-captcha/disk/longbow.slidercaptcha.js
This file has a reset option but i don’t know how to do it and do that in script above.