Form validation not working in ie8 or 7 - javascript

Hi basically i can't seem to get the form validation to work on my form in ie8 or below. It works absolutely fine every where else though.
Basically its along these lines:
function validateform() {
if (document.getElementById('firstinput').value == '') {
alert("Select start Date");
document.getElementById('firstinput').focus();
return false;
}
if (document.getElementById('secondinput').value == '') {
alert("Select end Date");
document.getElementById('secondinput').focus();
return false;
}
if (document.getElementById('restriction').checked == false) {
alert('Please select I have read and understand the above restrictions.');
return false;
}
if (document.getElementById('termscondition').checked == false) {
alert('Please select terms and condition..');
return false;
}
if (document.getElementById('letters_code').value == '') {
alert("Enter captcha code..");
document.getElementById('letters_code').focus();
return false;
}
return true;
}​
Just wondered if there are any obvious mistakes that i can't see :s thanks for any help in advance.

Editing because i phased this terribly!
I have encountered an issue involving a submit button being named submit, that only failed in IE, and not in firefox/chrome, if you could make sure that is not the issue, that would help!
Alternatively, more information would be helpful, as there does not appear to be anything wrong with the code posted

Related

jQuery - Validation

I'm having an issue with my validation process. I'm not using a standard "submit" button, rather I have <span class="button" id="print">Print</span> and jQuery listens for a click. This is the validation code I have when that "button" is clicked:
var validation = "";
function validate() {
$("#servDetails").find("input").each(function () {
if ($(this).prop("required") && $(this).val() == "") {
validation = false;
}
else {
validation = true;
}
});
$("#checklist").find("input[required]").each(function () {
if ($(this).prop("required") && $(this).val() == "") {
validation = false;
}
else {
validation = true;
}
});
}
$("#print").on("click", function() {
validate();
if (validation == false) {
alert("Please fill out all required inputs!");
return false;
}
else {
window.print();
}
});
If I click the button without filling anything out (all items blank), I get my alert as expected.
If I fill out all of the required elements, it pulls up the print dialouge as expected.
However, if I leave some of the boxes blank while others are correctly filled, it still goes to print instead of giving me the alert like I need. Any thoughts?
The code have to be rewritten, or better replace it with any validation plug-in.
But in your case, I suppose, you just forgot to return, in case you found some not filled field. So if you have any filled input it override your validation variable.
The simplest solution is to remove
else {validation = true;} code blocks, and add
validation = true;
at the beggining of the function.

jQuery empty input check function not working as expected

This question has been done to death on SO and I'm really, really sorry! I've already taken the bones of the below idea from a couple of SO questions on the same theme.
All said though, I still can't get it to work as expected.
It works OK if NONE are filled in.
It works OK if the END input is filled in and not the others.
It works OK if the MIDDLE input is filled in.
If you fill in ONLY the FIRST input though, it alerts, but submits anyway?
JSFIDDLE
$(document).ready(function (e) {
// completed count submit handler
$("#submit_counts_button").on('click', function () {
window.incomplete = false;
$('input[type=number]').each(function () {
if ($(this).val().length == 0) {
window.incomplete = true;
alert('Some fields are empty');
return false;
} else {
if (window.incomplete === false) {
$("#submit_counts_button").prop('disabled', true);
$("#submit_counts_button").html('Please Wait ...');
//$("#update_form").submit();
}
}
});
});
});
I'm sure it's something totally embarrassingly obvious but after a 16 hour day, I just can't see it. Any help appreciated ...
You need to pull the 'incompletion' check outside of the .each
$(document).ready(function (e) {
// completed count submit handler
$("#submit_counts_button").on('click', function () {
window.incomplete = false;
$('input[type=number]').each(function () {
if ($(this).val().length == 0) {
window.incomplete = true;
alert('Some fields are empty');
return false;
}
});
if (window.incomplete === false) {
$("#submit_counts_button").prop('disabled', true);
$("#submit_counts_button").html('Please Wait ...');
//$("#update_form").submit();
}
});
});
http://jsfiddle.net/6WpeF/6/
try
if(document.getElementById('id of input').value != ""){}

Why is this jQuery Validation not working on IE 7/8?

I'm encountering a small problem with a client-side validation script which works on all browsers including IE 9 / 10, but is giving me headaches on IE 7 and IE 8.
The page with the form which needs this validation can be accesed over here and someone must definetly take a look in order to give a good answer.
And here's the validation script I use for the form:
jQuery(document).ready(function(){
jQuery("#adaugareanunt").submit(function(event){
errornotice = jQuery("#eroareadaugare");
emptyerror = "Necompletat";
emailerror = "Email incorect";
email = jQuery('#contactEmail');
descriere = jQuery('#descriptionro_RO');
jQuery('#adaugareanunt input[type="text"]').each(function(){
if ((jQuery(this).val() == "") || (jQuery(this).val() == emptyerror)) {
jQuery(this).addClass("campuri-necesare");
jQuery(this).val(emptyerror);
errornotice.fadeIn(750);
} else {
jQuery(this).removeClass("campuri-necesare");
}
});
jQuery('#adaugareanunt select').each(function(){
if ((jQuery(this).val() == "")) {
jQuery(this).addClass("campuri-necesare");
errornotice.fadeIn(750);
} else {
jQuery(this).removeClass("campuri-necesare");
}
});
if(descriere.val() == "" || descriere.val() == emptyerror) {
descriere.addClass("campuri-necesare");
descriere.val(emptyerror);
errornotice.fadeIn(750);
} else {
descriere.removeClass("campuri-necesare");
}
if (!/^([a-zA-Z0-9_\.\-])+\#(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email.val())) {
email.addClass("campuri-necesare");
email.val(emailerror);
}
if (jQuery(":input").hasClass("campuri-necesare")) {
return false;
}
});
// Clears any fields in the form when the user clicks on them
jQuery(":input").focus(function(){
if (jQuery(this).hasClass("campuri-necesare") ) {
jQuery(this).val("");
jQuery(this).removeClass("campuri-necesare");
}
});
});
Any hints?
Thanks!
DanCapitanDePlai
It seems there is some error in your javascript file
Uncaught TypeError: Cannot call method 'addMethod' of undefined
at adaugare_anunt.js on line number 291 Please fix that error first because usually in IE8 and earilier when the javascript encounters error none of the javascript will work.
Please use ie IE9 and press f12 change the browser mode to ie8 and start debugging.
Hope this helps you
Thankyou
Madhu Rakhal Magar
Frits Van Campen gave me a hint and I found the error. I had to add var text before defining every variable. Modern browsers are not seeing this thing as required, but the older ones ask for it.
Thanks!

using getElementsByName to validate radio button

I'm attempting to validate whether a group of radio buttons is checked in order o validate a form.
function formValidator() {
var triedIt = document.getElementsByName('tried');
if(radioChecked(triedIt, "Please select") {
return true;
}
return false;
}
function radioChecked(elem, helperMsg) {
if(document.myform.tried.checked == 1) {
return true;
}
else {
alert(helperMsg);
elem.focus();
return false;
}
}
This returns the alert, but for some reason the form gets processed anyway. I'm wondering what I'm doing wrong... any help would be appreciated.
If you're wondering why I don't just use jquery etc... its unfortunately not an option. Thanks!
I think it's happening because document.getElementsByName('tried') returns array of elements. So, when you call elem.focus() it will throw error (because array haven't method focus) and js stops execution.
function formValidator(){
var triedIt = document.getElementsByName('tried');
if(radioChecked(triedIt, "Please select")){
return true;
}
return false;
}
function radioChecked(elem, helperMsg){
if(document.myform.tried.checked == 1) {
return true;
}else{
alert(helperMsg);
elem.focus();
return false;
}
}
try this i think you skipped one closing bracket ) in if(radioChecked(triedIt, "Please select")) that`s why its happening

Callback/validation tips for jeditable

Any tips for form validation using jeditable. I would like to have the script POSTed to pass back errors with JSON, with the submitted text but can't seem to figure that one out, if even possible. Or how to check text as it's being inputed via onChange.
Thx
Here is a simple sample, but not used jQuery Validation.
function isNumeric(value) {
if (value == null || !value.toString().match(/^[-]?\d*\.?\d*$/)) return false;
return true;
}
$('.edit').editable(your_url, {
onsubmit: function(settings, original) {
if (isNumeric(original)) {
return true;
} else {
//display your message
return false;
}
}
});

Categories