Javascript radio button value plus other text box

I have 2 sets of radio buttons for amounts plus a button "Other" and text box for free form amount entry.

To make things a bit trickier, the name of the radio buttons is dynamic, handled (correctly) in PHP.

Currently, the function works correctly for the first set of buttons, but without the Other amount.

How can I evaluate both sets of buttons in the one function?
Javascript:

function additionalSwap(iAmt){
	if (iAmt>=29) {
		document.getElementById('theImage').src = "../images/g2nd.jpg";    // Choosing new image based on amount
		document.getElementById('theImage1').src = "../images/g2nd.jpg";    // Choosing new image based on amount
	}
}

HTML/PHP:

Please choose your amount...
<?php
	$sDetails = "<input name='RB".$SelectedPartnerId."' type='radio' value='19' onclick='additionalSwap(this.value)' />$19";
	$sDetails .= "<input name='RB".$SelectedPartnerId."' type='radio' value='29' onclick='additionalSwap(this.value)' />$29";
	$sDetails .= "<input name='RB".$SelectedPartnerId."' type='radio' value='49' onclick='additionalSwap(this.value)' />$49";
	$sDetails .= "<input name='RB".$SelectedPartnerId."' type='radio' value='Other' onclick='additionalSwap(this.value)' />Other";
	sDetails .= "<input size='3' type='text' name='OtherAmt".$SelectedPartnerId."' />";
	echo $sDetails;
?>

Open in new window

kkbenjAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

mattibuttCommented:
hi
i am not sure what are you trying to accomplish you want to apply two sets of execution under same function? what is the purpose of combinng two different execution under same function or you want to execute further action under the same button please clarify/

thanks
0
kkbenjAuthor Commented:
I want a specific graphic to display if the TOTAL amount (from both sets of buttons) >= 29.
0
mattibuttCommented:
put the graphic in the div and add its propety to be
display=none

in the javascript add another if block

if (iAmt==29) {
            here div display = block
      }


you need add a right syntax i have given a rough example.

thanks
0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

kkbenjAuthor Commented:
I need to add the values from BOTH sets of radio buttons combined, plus the value entered into the OtherAmt text boxes.
0
kkbenjAuthor Commented:
I have the functionality in place to handle the graphic.  It's the evaluation of amounts I need the help with.
0
mattibuttCommented:
all you have to do is check variable value by comparing it to the dynamic value selected by the user if i am perceiving the same problem as you are.

thanks
0
kkbenjAuthor Commented:
I need a code example of how to refer to the variable named radio buttons please.
0
nap0leonCommented:
If your radio buttons look like this:
<form name="frmRadio" method="post">
    <input name="choice" value="1" type="radio" />1 
    <input name="choice" value="2" type="radio" />2 
    <input name="choice" value="3" type="radio" />3 
    <input name="choice" value="4" type="radio" />4
</form>

Open in new window


Your javascript to get the value of the button selected looks like this:
	<script language="JavaScript">
 
		function getRadioValue() {
			for (index=0; index < document.frmRadio.choice.length; index++) {
				if (document.frmRadio.choice[index].checked) {
					var radioValue = document.frmRadio.choice[index].value;
					break;
				}
			}
		}
 
	</script>

Open in new window

0
kkbenjAuthor Commented:
How can I reference the radio buttons that have names that are set via the PHP code?  Please see my code above.

The radio button name is RB + a variable name set in PHP.
0
nap0leonCommented:
A few thoughts...
1- names should be the same... make the IDs unique.  That way you can use the standard code for what you are trying to accomplish.

2- if you must have irregular names... the easy way out?
  a- declare a global variable
  b- add another function call to the onclick event that updates the value of the global variable to "this.id"
  c- whenever you want the value of the radio button that is selected, reference that new global variable.

3- if you must use irregular names... a method coders would consider better than my suggestion #2... use getElementsByTagName such as the following (totally untested, just typing it up as I go)
var allinputs = document.getElementsByTagName("input");
var re = new RegExp('^RB-','i');

for (var i = 0; i < allinputs.length; i++) {
  if(allinputs[i].name && re.test(allinputs[i].name)) {
    //looking at an input that starts with 'RB'
    if (allinputs[i].checked) {
      //whatever you want to do with it
    }
  }
}

Open in new window

0
nap0leonCommented:
wait a sec... why are you even using radio buttons?
radio buttons are for enforcing "only one item in the set is selected".
by having a different name on each radio button, the entire purpose of using radio buttons is shot to hell... you should just use checkboxes instead.

Another approach to getting which items (since they all have different names, there can be multiple items selected) is to give each of them a special class name like "class=I_like_using_radio_buttons_for_something_other_than_what_they_were_intended".  You can then use a "getElementsByClassName" method which is fairly easy to add to your JS
(see here for example: http://javascript.about.com/library/bldom08.htm)
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
kkbenjAuthor Commented:
nap0lean,
I'm sorry for any confusion.  I have 2 SETS of radio buttons.  The first set all have the same name, the second all have the same name but different from the first set.

I need the total of Set A value + Set B value.

I will try your suggestions in the morning.
0
kkbenjAuthor Commented:
nap0lean -

I have the getElementsByClassName working - exactly what I was looking for.  But how can I evaluate the value as numeric rather than strings?

I am attaching my code.

If I choose Set A button of 19 and Set B button of 29, the alert displays 1929.
textbox = document.getElementsByClassName('AddIt');
var iAmt = 0;
for (var i=0; i<textbox.length; i++) {
	if (textbox[i].checked) {
		iAmt = iAmt + textbox[i].value;
	}
}
alert(iAmt);

Open in new window

0
nap0leonCommented:
slap a "parsefloat" around it before adding:

iAmt = iAmt + parsefloat(textbox[i].value);

Open in new window

0
kkbenjAuthor Commented:
I have tried both parsefloat and intval.  I do not see an error but it does not evaluate the iAmt = iAmt + line.
0
kkbenjAuthor Commented:
Uncaught ReferenceError: parsefloat is not defined & intval is not defined
0
kkbenjAuthor Commented:
but parseFloat is case sensitive.

Works perfectly.  Thanks for all of the help!
0
nap0leonCommented:
oops - my bad - glad you caught it - should be parseFloat() not parsefloat.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.