I have a script that will hide a submit button while the form processes to prevent multiple clicks on the button. Recently it appears this is not working all the time.
I can verify that the validate jQuery file is loading each time. I didn't make difference when I used the file loaded from my server or a CDN.
The error only appears when the file is loaded from disk cache. I temporarily fixed the issue by adding a random version number after the jQuery file but I wondered what could be causing the break when disk cache is used?
The browser console lists this error:
custom-quote-form:21 Uncaught TypeError: $(...).validate is not a function
at HTMLDocument.<anonymous> (custom-quote-form:21)
at j (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at Function.ready (jquery.min.js:2)
at HTMLDocument.I (jquery.min.js:2)
jquery.min.js loads first, then the CMS cached JS file after that is the jquery validate file.
This is the script
<script>
$(function() {
$("form[name='customBuilder']").validate({
// remove error label
errorPlacement: function(error, element) {},
rules: {
fname: "required",
lname: "required",
phone: "required",
company: "required",
Email: {
required: true,
email: true
},
},
submitHandler: function(form) {
$("#loading-img").css("display", "block");
form.submit();
var elem = $("#submitMessage");
elem.css("display", "none");
setTimeout(function() {
elem.css("display", "");
}, 10000);
}
});
});
< /script>
A.Wolff set me on the right track. Removed defer="defer" from jquery validation plugin link. It was auto added by the CMS.