I have two radiobuttons in a group on my page. Based upon radiobutton selected i want to generate an alert.
var d=GetVal();
function GetVal()
{
var a = null;
var f = document.forms[0];
var e = f.elements["radiogroup"];
for (var i=0; i < e.length; i++)
{
if (e[i].checked)
{
a = e[i].value;
break;
}
}
return a;
}
At the time of form validation, It is always returning only first radiobutton value when iam reading it in if else loop.
if (!checkRadio("form","radiogroup"))
{
alert("none of the option was selected");
return false;
}
//if one radio option was selected
else
{
if(d="firstradiovalue"){
alert("first radio selected");
return false;}
else{
if(d="secondradiovalue"){
alert("second radio Selected");
return false;}
}
}
At the time of form submission, even if i choose second option i only get alert - "first radio selected". Any help. Thx in advance.
You need to use == not =:
if(d == "firstradiovalue"){
alert("first radio selected");
The return value of the expression d = "firstradiovalue" is d itself, which is always true.
Related
I have two checkboxes one named OPEN the other named WOMEN. I would like to require that one or the other has to be checked. If one isn't checked then both boxes would show as required. As soon as you check a box the other requirement goes away.
How are you wanting to check these fields? This should help get you started. Place this code on a button under the run a script mouse up. When the button is clicked the code will execute.
// Assign a variable to each check box
var openCheck = getField("OPEN");
var womenCheck = getField("WOMEN");
// If neither box is checked when the button is clicked
if (openCheck.value == "Off" && womenCheck.value == "Off") {
// Alert that they are required fields
app.alert("These fields are required");
}
// If OPEN is checked, uncheck WOMEN
if (openCheck.value == "On") {
womenCheck.value = "Off";
}
// If WOMEN is checked, uncheck OPEN
if (womenCheck.value == "On") {
openCheck.value = "Off";
}
I was able to accomplish this by doing the following.
On "OPEN" Button
if (this.getField("OPEN").value != "Yes") {
this.getField("WOMEN").required = true ;
this.getField("OPEN").required = true ;
} else {
this.getField("WOMEN").required = false ;
this.getField("WOMEN").value="Off";
}
On "WOMEN" Button
if (this.getField("WOMEN").value != "Yes") {
this.getField("OPEN").required = true ;
this.getField("WOMEN").required = true ;
} else {
this.getField("OPEN").required = false ;
this.getField("OPEN").value="Off";
}
I want to validate the input on a series of checkboxes. There must be at least one checkbox selected, otherwise the user gets an alert to select one. However, the alert appears unless all of the checkboxes are selected.
I realize that the issue is how my for loop params are set, but I cannot figure out how to fix it.
for(var i=0;i<7;i++){
if( !checkboxes[i].checked ){
alert( 'You need to select at least one day!');
checkboxes[i].focus();
return false;
}
}
You can use a flag to set the validation status and set it to true if atleast 1 item is checked.
Then after the loop check whether the flag is set else there are no checkboxes selected.
var valid = false;
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].checked) {
valid = true;
break;
}
}
if (!valid) {
alert('You need to select at least one day!');
checkboxes[0].focus();
return false;
}
You want to do the opposite of what you're coding. your current code flashes the alert if the current checkbox is not checked, that is, if ANY checkbox is not checked. you can modify it to something like this:
var isChecked = false;
for(var i=0;i<7;i++){
if( checkboxes[i].checked ){
isChecked = true;
}
}
if ( !isChecked ) {
alert( 'You need to select at least one day!');
checkboxes[0].focus();
return false;
}
var clicked = false;
$(".CheckBoxClass").each(function () {
if($(this).checked ) clicked = true;
}
if(clicked)
return true;
else ...
i have a grid with data colection and every row have a checkbox, i need ask: if any checkbox is not checked, show an alert message.
my code is:
var count = 0;
$('#checkableGrid').find("input:checkbox:is(:checked)").each(function () {
count++;
});
if (count == 0) {
alert("must check any item");
return false;
};
you have incorrect selector to target all input checkbox:
if(!$('#checkableGrid').find("input:checkbox:checked").length){
alert("must check any item");
return false;
};
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");
}
I have found scripts that do it, but they only work with one radio button name, i have 5 different radio button sets. How can i check if its selected right now i tried on form submit
if(document.getElementById('radiogroup1').value=="") {
alert("Please select option one");
document.getElementById('radiogroup1').focus();
return false;
}
does not work.
If you have your heart set on using standard JavaScript then:
Function definition
var isSelected = function() {
var radioObj = document.formName.radioGroupName;
for(var i=0; i<radioObj.length; i++) {
if( radioObj[i].checked ) {
return true;
}
}
return false;
};
Usage
if( !isSelected() ) {
alert('Please select an option from group 1 .');
}
I'd suggest using jQuery. It has a lot of selector options which when used together simplify the much of the code to a single line.
Alternate Solution
if( $('input[type=radio][name=radioGroupName]:selected').length == 0 ) {
alert('Please select an option from group 1 .');
}
var checked = false, radios = document.getElementsById('radiogroup1');
for (var i = 0, radio; radio = radios[i]; i++) {
if (radio.checked) {
checked = true;
break;
}
}
if (!checked) {
alert("Please select option one");
radios.focus();
return false;
}
return true;
A very simple function is:
<script type="text/javascript">
function checkRadios(form) {
var btns = form.r0;
for (var i=0; el=btns[i]; i++) {
if (el.checked) return true;
}
alert('Please select a radio button');
return false;
}
</script>
<form id="f0" onsubmit="return checkRadios(this);">
one<input type="radio" name="r0"><br>
two<input type="radio" name="r0"><br>
three<input type="radio" name="r0"><br>
<input type="submit">
</form>
However, you sould always have one radio button selected by default (i.e. with the select attribute), some user agents may automatically select the first button. Then you just need to check if the default (usually the first one) is checked or not.
Why don't just use a oneliner?
I wrote this code, it will submit the form if at least one radio is checked:
(function(el){for(var i=el.length;i--;) if (el[i].checked) return el[i].form.submit()||1})(document.form_name.radio_name)||alert('please select item')
Otherwise it will make an alert. Or you may also modify it to use with form's onsubmit:
return (function(el){for(var i=el.length;i--;) if (el[i].checked) return 1})(document.form_name.radio_name)||alert('please select item')
Just replace form_name and radio_name accordingly.
See how it works: http://jsfiddle.net/QXeDv/5/
Here's a good tutorial -> http://www.somacon.com/p143.php
// return the value of the radio button that is checked
// return an empty string if none are checked, or
// there are no radio buttons
function getCheckedValue(radioObj) {
if(!radioObj) return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
if(radioObj.checked) return radioObj.value;
else return "";
for(var i = 0; i < radioLength; i++) {
if(radioObj[i].checked) return radioObj[i].value;
}
return "";
}
// set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
if(!radioObj) return;
var radioLength = radioObj.length;
if(radioLength == undefined) {
radioObj.checked = (radioObj.value == newValue.toString());
return;
}
for(var i = 0; i < radioLength; i++) {
radioObj[i].checked = false;
if(radioObj[i].value == newValue.toString()) radioObj[i].checked = true;
}
}
Are you ok with jquery? If so:
$(document).ready(function(){
if($('input[type=radio]:checked').length == 0)
{
alert("Please select option one");
document.getElementById('radiogroup1').focus();
return false;
}
}