homepage Welcome to WebmasterWorld Guest from 54.196.24.103
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Change radio button dynamically -- two javascripts on same page
SuziQ




msg:1493882
 6:08 pm on Nov 16, 2003 (gmt 0)

Okay

Sorry if this is an easy one folks, but I haven't been able to find code for this anywhere, and I've spent way too much time on this already...

I have two sets of radio buttons in my form defined as
membershiptype
funds

Is there any way that I can set up the form so that if
membershiptype = "$37.45 Membership Canada" is selected
then the funds button adjusts itself to "$CDN"

Alternately, if
membershiptype = "$35 Membership US" is selected
then the funds selection appears as "$US"

Any help would be greatly appreciated. Thanks.

 

mikegram




msg:1493883
 3:31 pm on Nov 17, 2003 (gmt 0)

I hope I understood you. Is this what you mean?

<!-- place in HEAD -->
<script language="JavaScript" type="text/javascript">
function autoSelect(memberType, fundsType)
{
if(memberType.value=="Canada")
fundsType[0].checked=true;
else
fundsType[1].checked=true;
}
</script>

<!-- place in BODY -->
<form action="YourActionHere" method="post" name="myForm" id="myForm">
<input type="radio" name="membershiptype" value="Canada" checked onClick="autoSelect(this,document.myForm.funds)">$37.45 Membership Canada
<input type="radio" name="membershiptype" value="US" onClick="autoSelect(this,document.myForm.funds)">$35 Membership US<br>
<input type="radio" name="funds" value="$CDN" checked>$CDN
<input type="radio" name="funds" value="$US">$US<br>
<input type="submit" value="Submit">
</form>

SuziQ




msg:1493884
 12:09 am on Nov 18, 2003 (gmt 0)

Thanks, it's exactly what I wanted it to do.

However, when I try it in my form it conflicts with an existing script I borrowed to do addition in my form. I have no idea how to combine the two on-click functions... to be honest I don't even know if it's possible.

[edited by: tedster at 1:38 am (utc) on Nov. 18, 2003]

mikegram




msg:1493885
 4:12 am on Nov 18, 2003 (gmt 0)

There may in fact be a logical conflict with the other script. I can't say. But if you simply want to call two functions in succession from an onClick event, it would look something like.

<input type="radio" name="membershiptype" value="Canada" checked onClick="autoSelect(this,document.myForm.funds);yourAddFunction(param1, param2);">

SuziQ




msg:1493886
 1:36 pm on Nov 18, 2003 (gmt 0)

No real conflict, as a beginner I just don't have a real grasp of the finer points of javascript (like I said, I did't know it was possible).

I've added it into the script and it works perfectly!
Thank you!

While I have you here, the script I'm using to total.form clears my radio buttons when the form inits. Do you know of a good script for validating radio buttons?

I'm validating all my text fields using a verify function where each field is prompted by:

if (document.ThisForm.toname.value=="") {
themessage = themessage + " ~ Recipient's Name";
}

but it doesn't seem to work for the radio button values.

Any advice?

mikegram




msg:1493887
 3:21 pm on Nov 18, 2003 (gmt 0)

function formValidSubmit(memberType, fundsType)
{
if(!memberType[0].checked &&!memberType[1].checked)
{
if(!fundsType[0].checked &&!fundsType[1].checked)
alert("Please select a membership and funds type");
else
alert("Please select a membership type");
}

if(fundsType[0].checked fundsType[1].checked && memberType[0].checked memberType[1].checked )
{document.myForm.submit();}
}

...
<input type="button" value="Submit" onClick="formValidSubmit(document.myForm.membershiptype, document.myForm.funds)">
...

Change the Submit button to type="button". If a selection has been made for both radio fields then the form submits; otherwise, the user gets an alert.

I don't know if your other validation script is triggered in the same way. If so just paste the code inside this function into your other function and add the arguments to the function call and their corresponding parameters into the function declaration.

While this works fine for a bank of radio buttons with a few options, it might be a little impractical for a bank with ten or more. I'm sure there's a more efficient way to do this. Would love to see it if someone knows how.

SuziQ




msg:1493888
 5:03 pm on Nov 18, 2003 (gmt 0)

Actually, my form controls are
<FORM NAME="ThisForm" METHOD=POST ACTION="form.php" onSubmit="return verify ();">

and my submit is
<input type="submit" value="Submit" name="B1">

Know of a way to build the radio button validate directly into the verify function?

mikegram




msg:1493889
 6:25 pm on Nov 18, 2003 (gmt 0)

In general, you would just use the nested IFs at the beginning my formValidSubmit() in your validate function.

Pass it the radio button objects in the function call:
return verify(document.myForm.membershiptype, document.myForm.funds);

Also, set up those same parameters in the function declaration of my script in your validate script:
function verify(memberType, fundsType)

There's a little more to it than that, but I really need to see your script to help.

SuziQ




msg:1493890
 3:55 pm on Nov 25, 2003 (gmt 0)

Hey Mike,

I've been working on this for about the last week or so, trying variations on the code to resolve the issue, but I can't figure it out. I tried entering the functions into the code as per your last message and it works fine, so long as I only have one button being verified.

As soon as I try to enter any of the other 3 buttons to be verified (funds, optout, calendar) into the code I get an error "0 is null or not an object" and the form is allowed to submit blank.

I'll send you a sticky note with the verify code I'm using, since it's a little long to enter here. Thanks again!

Sue

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved