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

x
?
Solved

javascript IF on radio button value

Posted on 2011-02-16
11
Medium Priority
?
326 Views
Last Modified: 2012-05-11
I have a radio group, bill 3 radio buttons
values:
a
b
c

I could ge the radio button value.

On the c value i want to do a javascript if() to validate the credit card fields only if radio button with the c value is selected
New-Text-Document--6-.txt
0
Comment
Question by:smares32371
[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
  • 5
  • 5
11 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 34911988
Check this :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
	function validate() {
		var tp = document.getElementsByName("typep");
		var checkIsSelected = tp[0].checked;
		var paypalIsSelected = tp[1].checked;
		var creditCardIsSelected = tp[2].checked;
		var creditCardNumberIsValid = validateCrediCardNumber(document.getElementById("cnumber"));
		var creditCardIsNotOK = !creditCardIsSelected || !creditCardNumberIsValid;
		if( creditCardIsSelected && creditCardIsNotOK ) {
			alert("Please enter a valid credit card number")
		}
		return checkIsSelected || paypalIsSelected || !creditCardIsNotOK; 
	}
	function validateCrediCardNumber(field) {
		// simple check here
		return field.value.length>0;
	}
</script>
</head>
<body>
<form onsubmit="return validate();" action="#">
    <input type="radio" name="typep" value="a" />Check<br />
    <input type="radio" name="typep" value="b" />Paypal<br />
    <input type="radio" name="typep" value="c" />Credit card&nbsp;<input type="textbox" name="cnumber" id="cnumber" /><br />
    <input type="submit" value="Submit" />
</form>
</body>
</html>

Open in new window

0
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 34914879
@smares32371: not sure if you need this advice, but i would suggest that you go for a drop-down rather than radio buttons for this one. In this way, all you need to do is, check the value of one field.

Let me know if you code base for this.
Please no points for this comment of mine, since if @leak's reply works, he deserve all points :)
0
 

Author Comment

by:smares32371
ID: 34917886
leakim971: ok its working how do i validate the rest of the credit card fields, there is like 10 more
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 

Author Comment

by:smares32371
ID: 34918114
I just want to make sure that the credit card fields are filled in .
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34918416
line 21 :
return field.value.length>0;

Open in new window


we check the field have one char (>0)
if you want 10 charactere or more :
return field.value.length>=10;

Open in new window

0
 

Author Comment

by:smares32371
ID: 34918529
I meant I want 2 other fields to give alerts if they not filled in
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34918870
close the question, award points (or not), try to understand the code, create a new question if you encounter difficulties
0
 

Author Comment

by:smares32371
ID: 34918946
i do understand the code but it only allows you to validate one field if the third radio button is selected lets forget about credit card fields, in general how would i validate normal fields base on the third button when there is more than one field.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 34919278
what do you mean by validate ? Not empty ? Check the length propertie of its value (a string)

var myField_Value = document.getElementById( myField_ID ).value;
var myField_Is_Filled = myField_Value.length > 0; // this return true or false

with a field like this one :

<input type="text" id="myField_ID" name="myField_Name" />

Open in new window


to validate multiple fields : return myField1_Is_Filled && myField2_Is_Filled && myField3_Is_Filled;
0
 

Author Comment

by:smares32371
ID: 34919727
yes not empty
0

Featured Post

The top UI technologies you need to be aware of

An important part of the job as a front-end developer is to stay up to date and in contact with new tools, trends and workflows. That’s why you cannot miss this upcoming webinar to explore the latest trends in UI technologies!

Question has a verified solution.

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

Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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)
The viewer will learn the basics of jQuery including how to code hide show and toggles. 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…

705 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