We Keep Coding

jQuery check if input is empty

I am trying to get it where, if there is value in the input, go ahead and do your thing but if there isn't, don't do anything. I keep getting getting it where, if there is nothing in the input, a failure message occurs but only if I hit the enter key
jsfiddle.net/BBaughn/8ovrmhgp click the space in the lower right corner, then press enter. It shouldn't pop up, because the input is not focused.
login/failure jQuery:
$(document).ready(function(){
$('.btn1').on('click', function(){
var login = [marion, 'FATHER1'];
var marion = $('#logging').val();
marion = marion.toUpperCase();
if (marion !== 'FATHER1' && $('#logging').val()) {
alert('Login Failed');
} else if (marion === 'FATHER1' && $('#logging').val()) {
$('.notify').css('margin-top', '0');
$('#logging').val('');
}
});
$('.exit').on('click', function(){
$('.notify').slideUp('slow');
});
});

if you just want to check if an input is empty, I'm guessing #logging is the input:
$('.btn1').on('click', function(){
var marion = $('#logging').val();
if (marion == '') {
//this means the input value was empty
}
});

if the length is equal zero, that means the field is empty. It works after adding length === 0 check, please try this,
if (e.which == 13 && $('.btn1').val().length === 0) {
e.preventDefault();
} else if (e.which == 13 && $('.btn1').focus()) {
$('.btn1').click();
}

Ok, I think I get what you mean now. You're checking the entire document for keypresses as is, you need to check the input only. I think this is a good solution to do that:
$('.login input').keypress(function (e) {
if (e.which == 13 && !$('#logging').val()) {
e.PreventDefault();
} else if (e.which == 13 && $('.btn1').focus()) {
$('.btn1').click();
}
});
Working Fiddle here

$(document).ready(function(){
$('.btn1').on('click', function(){
var login = [marion, 'FATHER1'];
var marion = $('#logging').val();
marion = marion.toUpperCase();
if (marion !== 'FATHER1' && $('#logging').val()) {
alert('Login Failed');
} else if (marion === 'FATHER1' && $('#logging').val()) {
$('.notify').css('margin-top', '0');
$('#logging').val('');
}
});
$('.exit').on('click', function(){
$('.notify').slideUp('slow');
});
});
I didn't realize that my if statement was if the input wasn't detecting the right login, so it didn't matter if it was out of focus. Now it says "if it's not FATHER1 and there is value in the input only, then send this alert"

How to tell if a radio button is left unchecked with Javascript/JQuery

I am creating a quiz/survey form with jQuery and javascript and I am having some trouble with the question validation.
The way the quiz/survey creation works is a series of show/hides display relevant form fields. The user fills out one set of fields for the first question and then they are asked if they would like to add another question to their quiz/survey and the next set of form fields is displayed.
I am struggling because instead of having a massive validation when the user has completed all of their possible form fields I am running a validation script at the end of each question with the associated form field IDs and values being passed into the script upon the user completing that question. This script is below, but some key areas of the script are based upon whether radio buttons have been checked. For instance if the user has left the question text area empty they are alerted to fill in question text, or if they select a true/false answer or multiple choice answer, they are supposed to determine which is the correct answer based upon a radio button list. Here is the entire validation code:
var questionValidate = function(qTextID, qAnswerType, TFID, MCID, MCText1, MCText2, MCText3, MCText4, VisRef, Youtube, Vimeo, ImgID) {
// alert(qTextID, qAnswerType, TFID, MCID, MCText1, MCText2, MCText3, MCText4, VisRef, Youtube, Vimeo, ImgID);
if (jQuery('select[name="CAT_Custom_14"]').val() == 'Quiz') {
if (jQuery(qTextID).val() == "") {
var qText = true;
alert('Question Text field is blank!');
};
if (jQuery(qAnswerType).val() == " ") {
var answertype = true;
alert("There's no answer selected.");
} else if (jQuery(qAnswerType).val() == 'True/False') {
if (jQuery(TFID).attr("checked") == true) {
var tfanswer = true;
var mcanswer = false;
alert('True False is selected');
} else if (jQuery(TFID).attr("checked") == false) {
alert('True False is not selected.');
};
} else if (jQuery(MCID).attr("checked") != 'checked' ) {
var mcanswer = true;
var tfanswer = false;
alert('The correct Multiple Choice Answer is not selected');
if (jQuery(MCText1).val() == "" || jQuery(MCText2).val() == "" || jQuery(MCText3).val() == "" || jQuery(MCText4).val() == "") {
var mcTextfields = true;
alert("There are Multiple Choice Fields that you have left blank.");
} else {
mcTextfields = false;
};
};
if (jQuery(VisRef).val() != " ") {
if (jQuery(VisRef).val() == "Youtube Video" && jQuery(Youtube).val() == "") {
youtubeVal = true;
alert('Please enter your Youtube Video code.');
} else if (jQuery(VisRef).val() == "Vimeo Video" && jQuery(Vimeo).val() == "") {
vimeoVal = true;
alert('Please enter your Vimeo Video code.');
} else {
validateImage(ImgID);
};
} else {
youtubeVal = false;
vimeoVal = false;
tempImgCheck = false;
}
};
};
I have run into a way to tell whether the radio button is checked, however it does not appear to be working with my script the way that I want it to. If you look at this area of the code you should be able to see that it first determines the answer type (true/false or multiple choice) and then if the correct answer is not selected the user should be alerted. So if they do not select the 'true', 'false', 'a', 'b', 'c', or 'd' radio button the validation should alert them to select it.
If there are any other ways to check if the correct radio buttons are selected I would appreciate anyone's help in figuring this out.
Thank you so much!

I think you want something like this:
if($('#radio_button').is(':checked')){
alert("I am checked");
}
You could check for a button that isn't checked by negating that statement.
if(!$('#radio_button').is(':checked')){
alert("I'm not checked");
}

Validate multiple textboxes

I have this code that validates if ContentPlaceHolder1_locationTextBox has text in it before newIndex can become 3.
if ((newIndex === 3 && $("#ContentPlaceHolder1_locationTextBox").val() == "")) {
$('#ContentPlaceHolder1_locationLabelV').show();
return false;
}
else {
$('#ContentPlaceHolder1_locationLabelV').hide();
}
However I also have ContentPlaceHolder1_countryTextBox & ContentPlaceHolder1_seaTextBox on the page with thier respective labels, how can I modify the script so that it validates against all textboxes?
I tried adding a horrible or statement however this was causing the page to freeze. What s the best method to check against all three textboxes?

You can add class for all inputs, example: validate
After you can create JS function. You can fire this function as you wish.
function check(){
$('.validate').each(function(){
label = $("label[for='"+$(this).attr('id')+"']");
if ((newIndex === 3 && $(this).val() == "")) {
label.show();
return false;
}
else {
label.hide();
}
});
}

function validate(value) {
if ...
//show div
else ...
// hide div
}
$("input[type='text']").each(function(){
//value from input text field
var myval = $(this).val();
//call validation function
validate(myval);
});

clear form fields onblur on all fields

Hey so I am working on a calculator with a form and javascript. I want that when the user clicks in a field and the value is "0" the field gets cleared. When he clicks outside the field while the value is "" I want the field to be filled again with 0. I can easily do so for specific fields like that:
document.forms[0].elements[0].onfocus = function() {
if(this.value == "0") {
this.value = "";
}
};
document.forms[0].elements[0].onblur = function() {
if(this.value == "") {
this.value = "0";
}
};
But I want it to work with every field and I don't want to write this bunch of code for every field and I do not want to use inline references in my html. Which option do I have? Thanks in advance.

Try this.
You can also replace the 'document.forms[0].elements' by 'document.querySelectorAll("form input")', etc.
Array.prototype.slice.call(document.forms[0].elements).forEach(function(element){
element.onfocus = function() {
if(this.value == "0") {
this.value = "";
}
};
element.onblur = function() {
if(this.value == "") {
this.value = "0";
}
};
})

Looking for a hand on my jQuery and JS script

What I have is in my fiddle here http://jsfiddle.net/mPuj9/4/
What I tried to do is to disable the button until all of textboxes are filled and the checkbox is checked. My current code is not good, it let you submit in some cases and I don't know how to work it with the checkbox.
CODE
$(document).ready(function() {
$('.textfield').blur(function() {
if ($.trim(this.value) == "") {
$('#btnUpdate').attr("disabled", true);
}
else {
$('#btnUpdate').removeAttr("disabled");
}
});
});
$(document).ready(function() {
$('#termid').change(function() {
var val = $(this).val();
$('#reservationdetails').empty().addClass('loading').load('../kratisis/forms/' + val + '.php', function() {
$('#reservationdetails').removeClass('loading')
});
});
});

Here you go
http://jsfiddle.net/mPuj9/8/
$(document).ready(function () {
$('form').delegate('input:text, input:checkbox', 'blur keyup change', function () {
if(($('form input:text').filter(function(){ return $.trim(this.value) == ''; }).length > 0)
|| ($('form input:checked').length == 0)){
$('#btnUpdate').attr("disabled", true);
}
else {
$('#btnUpdate').removeAttr("disabled");
}
});
});

Here's another way you could do this, which also works if someone presses enter in a text box, or if the browser autofilled an input:
$(function() {
$("form button").attr("disabled", true); //disable buttons at first
var inputs = 0; //keep count of the inputs
$("form input, form select, form textarea").each(function() {
inputs++; //increment counter
$(this).keypress(function() {
if ($.trim($(this).val()) != "") { //if the value isnt empty
inputs--; //decrement counter
if (inputs == 0) { //if theyre all filled in
$("form button").attr("disabled", false);
}
}
}).trigger("keypress"); //in case it was autofilled by the browser
});
$("form").submit(function(e) { //prevent the form being submitted by pressing enter
if (inputs != 0) { //if they arent all filled in
alert("Some fields aren't filled in. Please fix them and try again."); //tell the user
e.preventDefault(); //cancel sending the form
return false;
}
});
});

I think the problem is that you're not using .each() for the text fields. You're checking the one that was recently changed to see if it's value is "", but you're not checking each one.