I have this code
$(document).ready(function() {
$.fn.hasAttr = function(name) {
return this.attr(name) !== undefined;
};
});
function hasValue(elem) {
return $(elem).filter(function() {
return $(this).val();
}).length > 0;
}
if (hasValue("#Account")) {
$("#Account").removeAttr('required');
$("#AccountError").css({
'display': 'none'
});
return true;
} else {
if ($("#Account").hasAttr('required')) {
$("#Account").focus();
$("#AccountError").css({
'display': 'block',
'color': 'red'
}).html("Please select a valid Account.");
return false;
}
}
if (hasValue("#PDF")) {
$("#PDF").removeAttr('required');
$("#PDFError").css({
'display': 'none'
});
return true;
} else {
if ($("#PDF").hasAttr('required')) {
$("#PDF").focus();
$("#PDFError").css({
'display': 'block',
'color': 'red'
}).html("Please upload only PDF file.");
return false;
}
}
var e = document.getElementById("StatusID");
e.onchange = function() {
changeHandler();
};
window.onload = function() {
changeHandler();
};
function changeHandler() {
var _c = document.getElementById('TTS').value;
var e = document.getElementById("StatusID");
if (!$(e).is("select")) {
var strUser = e.value;
} else {
var strUser = e.options[e.selectedIndex].value;
}
if (_c == 0 && strUser == 7) {
$(".Star").css('display', 'inline-block');
document.getElementById('Account').setAttribute("required", "");
document.getElementById('PDF').setAttribute("required", "");
} else {
$(".Star").css('display', 'none');
document.getElementById('Account').removeAttribute("required");
document.getElementById('PDF').removeAttribute("required");
}
}
The problem is that when the changeHandler code runs it basically catches two conditions and if those are yes it adds the required attribute.
Now the problem is when it runs that code and submits the button, only the first one which is Account is validated when I provided a value to it, it never goes to the second validation.
Anyone knows what I am doing wrong here?