I have a field called as cellphoneDetails, I am trying to attach an invalid event to it, but it is not attaching the event to it
$(document).ready(function(e) {
var x = document.getElementById("contactEditForm");
if (x.addEventListener) {
var error = 0;
alert('bingo');
x.addEventListener("submit", function(e) {
alert('test test');
$("##CellphoneDetails").on("invalid", function() {
alert($(this).val());
error = 1;
if ($(this).val() != '') {
$(this).focus();
$("##cellValidDetails").css('display', 'block');
}
});
}
}
});the HTML has the pattern added to it which validates if the value is entered, it should be a valid cellphone number else if its empty, do not validate it and move ahead
but due to some issue, the event is not attaching to the submit call and making a mess
First thing I noticed is that it should be $("#CellphoneDetails"), not $("##CellphoneDetails"), and $("#cellValidDetails") instead of $("##cellValidDetails").
To target and ID, you only need one #.
Also, I believe (x.addEventListener) will always be undefined.
You have a mix of JS and jQuery, I'd suggest just using one or the other primarily.