Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Require a Radio Button be Selected if a Checkbox is

Posted on 2015-02-22
6
Medium Priority
?
73 Views
Last Modified: 2015-02-22
I am really trying to avoid reverting back to javascript for this but I am having a heck of time in jquery.    I have a checkbox that if checked, I need to require ONE of the radio buttons be selected as well.    This works great if there is only one radio button but not so much if there is more than one...

JQUERY
if ($('input:checkbox[value=658]').is(':checked') && ($("##cepftestid").is(":not(:checked)")) ) {
			 alert('You have selected to purchase a CEFP Exam but you have not indicated the date you wish to attend.');
			 var1 = 0;
		}

Open in new window


HTML
<h2><input type="checkbox" name="itemnumber" value="658" data-cost="600.0000" data-options="#cefpexams" class="itemnumber" > Register for an Exam  ($600.00)</h2>


<div id="cefpexams" style="display:none;">
<input name="cefptestid" type="radio" value="00/00/0000" id="cefptestid"  /> I will take the exam at a proctored location<br />
<input name="cefptestid" type="radio" value="12/30/1899" id="cefptestid"  /></TD><TD> December 30, 2015
</div>

Open in new window

0
Comment
Question by:digitalwise
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
6 Comments
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 2000 total points
ID: 40624504
Hi,
there are some typos in your code (e.g. wrong radiobutton ID selector):
if ($('input:checkbox[value=658]').is(':checked') && !($("#cefptestid").is(":checked")) ) {
			 alert('You have selected to purchase a CEFP Exam but you have not indicated the date you wish to attend.');
			 var1 = 0;
		}

Open in new window


And here a sample:
http://jsfiddle.net/EE_RainerJ/yjqxbyj9/

HTH
Rainer
0
 

Author Closing Comment

by:digitalwise
ID: 40624512
Thank you!   I need 5 minutes to breath so I can actually look over JQUERY instead of just finding what I need!
0
 
LVL 44

Expert Comment

by:Chris Stanyon
ID: 40624564
Ooooh. You accepted an answer before I had a chance to comment. Rainer's solution won't. Tick the box and select the second radio button, and you'll still get the error!

Your inputs are using the same IDs, and as I've said before, they need to be unique!!
0
URL rewriting in AWS CloudFront

A quick how-to guide to implement with a Lambda function!

 

Author Comment

by:digitalwise
ID: 40624570
Ah!   And I only tested it for the first one and it worked.    So if they are unique, how the heck do I make sure ONE of them is selected?    Do I need to reopen this or something??   Ughhh!
0
 
LVL 44

Expert Comment

by:Rainer Jeschor
ID: 40624580
Hi,
Chris is right (I thought I tested all options). Nevertheless, another (correct) selector would be:
$('input:radio[name="cefptestid"]')

Open in new window


I have updated the jsFiddle from above as well:
http://jsfiddle.net/EE_RainerJ/yjqxbyj9/

HTH
Rainer
0
 

Author Comment

by:digitalwise
ID: 40624590
Thanks guys!
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

721 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question