Click to See Complete Forum and Search --> : function to call another function


LocalHero
05-18-2005, 01:55 PM
I have a radio group that needs to change which function is selected. This is what I came up with:
function printstyle() {
if (document.forms.form15.RadioGroup1.value == "blank") blank();
if (document.forms.form15.RadioGroup1.value == "HT") heat();
if (document.forms.form15.RadioGroup1.value == "SS") screen();
if (document.forms.form15.RadioGroup1.value == "") document.forms.orderform_16180.amount.value = "Step #2";
}

The idea was that each function would have a different formula for bulk pricing for each type of printing. So the user can select what type he/she wants. If none are selected it would say "step #2" (where the radio group is). If they click screen printing (screen), then the function screen would take over and calculate the total. Am I missing something?

Ultimater
05-18-2005, 05:25 PM
Your function is error-free and if there is anything wrong with it, then you made a logical error.
Your function only handles 4 cases of RadioGroup1.value, you should also provide a default value. Also, you may need to provide a return value.

Try:

function printstyle() {
if (document.forms.form15.RadioGroup1.value == "blank") blank();
else if (document.forms.form15.RadioGroup1.value == "HT") heat();
else if (document.forms.form15.RadioGroup1.value == "SS") screen();
else document.forms.orderform_16180.amount.value = "Step #2";
return false
}

LocalHero
05-19-2005, 10:40 AM
I used the code modifications, and it worked slighlty better. But now it just says "step 2" no matter what which radio I click. I've checked the names and the logic, and everything looks like it should work. I don't get any errors. Here is what I have:

(This is in an external js file, but the link works)
function printstyle() {
if (document.forms.form15.RadioGroup1.value == "blank") blank();
else if (document.forms.form15.RadioGroup1.value == "HT") heat();
else if (document.forms.form15.RadioGroup1.value == "SS") screen();
else document.forms.orderform_16180.amount.value = "Step #2";
}

<form name="form15" id="form15" method="post" action="">
<input type="radio" name="RadioGroup1" value="blank" id="blank" onclick="printstyle()"/>Blank (no print)
<input type="radio" name="RadioGroup1" value="HT" id="HT" onclick="printstyle()"/>Heat Transfer
<input type="radio" name="RadioGroup1" value="SS" id="SS" onclick="printstyle()"/>Silk Screen Printing
</form>

Used this way, I always get "step #2". If I change the double equal signs in the js file to one equal sign, then it always runs the blank() function no matter what. Please help! I'm so lost.

Ultimater
05-19-2005, 10:52 AM
Try adding this in:

function printstyle() {
if (document.forms.form15.RadioGroup1.value == "blank") blank();
else if (document.forms.form15.RadioGroup1.value == "HT") heat();
else if (document.forms.form15.RadioGroup1.value == "SS") screen();
else if(!document.forms.form15.RadioGroup1.value)return false;
else document.forms.orderform_16180.amount.value = "Step #2";
}

LocalHero
05-19-2005, 11:09 AM
I really appreciate your help, but it doesn't try and run any option now. In effort to try and scale down the problem to slove, I've made this page. Can you cut and paste and see if it works for you or if you see any problems?

<HTML>
<HEAD>
<TITLE>Untitled Document</TITLE>
<SCRIPT type="text/javascript">
function printstyle() {
if (document.forms.form15.RadioGroup1.value == "blank") blank();
else if (document.forms.form15.RadioGroup1.value == "HT") heat();
else if (document.forms.form15.RadioGroup1.value == "SS") screen();
else if(!document.forms.form15.RadioGroup1.value)return false;
else document.forms.orderform_16180.amount.value = "Step #2";
}

function blank() {
document.forms.orderform_16180.amount.value = "blank item";
}

function heat() {
document.forms.orderform_16180.amount.value = "heat transfer";
}

function screen() {
document.forms.orderform_16180.amount.value = "screen printing";
}
</SCRIPT>
</HEAD>
<BODY>
<FORM name="form15" method="post" action="">
<P>
<LABEL>
<INPUT type="radio" name="RadioGroup1" value="SS" onChange="printstyle()">
screen</LABEL>
<BR>
<LABEL>
<INPUT type="radio" name="RadioGroup1" value="blank" onChange="printstyle()">
blank</LABEL>
<BR>
<LABEL>
<INPUT type="radio" name="RadioGroup1" value="HT" onChange="printstyle()">
heat</LABEL>
</P>
</FORM>
<P>o</P>
<FORM name="orderform_16180" method="post" action="">
<INPUT type="text" name="amount">
</FORM>
</BODY>
</HTML>

Ultimater
05-19-2005, 11:24 AM
Yo, the onchange event isn't cross-browser compatible. :(
You should seriously use an ONSUBMIT event inside of the FORM tag instead.
It makes things much much easier if we use that approach rather than ONCHANGE.

LocalHero
05-19-2005, 11:29 AM
I changed the 3 events to onSubmit, and added a submit button, but the page still won't call the other functions correctally. You can call other functions withen a function, right?

Ultimater
05-19-2005, 11:38 AM
Of coarse you can. :)
Wanna post the whole code you got so far? I'll touch it up.

LocalHero
05-19-2005, 11:52 AM
I don't know what to give you, and what to leave out. So here is everything. This is a template for an order form. So it isn't finished. I'm using Dreamweaver to edit it, so the php doesn't work. If you change the onblur function in the top quantity box to "screen()" then it will work like it is suppost to, but only for one price curve. The heat() curve formula isn't finished yet so I've used a arbitrary number. I know this is confusing, I am happy to answer any questions. I really want to solve this problem. Thanks for all of your help.

Ultimater
05-19-2005, 12:02 PM
Hmm.. do you have a working example on the web? 'Cas your code is missing several JS files and the such.

LocalHero
05-19-2005, 12:28 PM
Sorry, I posted two. http://www.localheroclothing.com/testfiles/homexx.htm and http://www.localheroclothing.com/testfiles/homexxgood.htm

The second one works for one curve because it only calls the screen() curve.
The first on doesn't because it calls the printstyle() function and won't go beyond that.
Just type in a quantity and go to the bottom.

Thank you so much for taking the time to do this.

Ultimater
05-19-2005, 12:56 PM
That will do, I got all the information I need. :)
I'll go study that code and tell you an ideal solution when I'm done. :)

Ultimater
05-19-2005, 01:41 PM
In your first link, ya know that if you provide a non-numaric value for the quantity in step 1 and click on the read-only quantity input field in step 5, that you recieve an infinate alert stack? :D

Ultimater
05-19-2005, 01:55 PM
To prevent that stack of infinate alerts from occuring you should omit the ONBLUR event from your readonly quantity field because users cannot even change its value manually.
Thus, you'd turn:
<input name="amount" type="text" size="5" onBlur="checkDecimals(this.form.amount, this.form.amount.value)" readonly/>
into:

<input name="amount" type="text" size="5" readonly/>


However, you probably don't care about this problem at the moment, so I'll get back to work. :)

Ultimater
05-19-2005, 02:04 PM
Eeeeh.... Why does your code have two BODY tags!?

<body onload="MM_preloadImages('Navbar/spinnyhero2.gif')">
<!--Checkbox add thingy-->
<BODY onLoad="InitForm();" onreset="InitForm();">

merge those together like:

<body onload="MM_preloadImages('Navbar/spinnyhero2.gif');InitForm();"
onreset="InitForm();">

Ultimater
05-19-2005, 02:33 PM
Ok I studied your code and this is basicly what the code amounts to:
(a bunch of forms and input)
Followed by the main form:

<form name="agreeform" onsubmit="return defaultagree(this)">
<input type="submit" name="Submit2" disabled value="Add Order to Cart"
onsubmit="javascript: document.orderform_16180.submit()"/>
<input name="agreecheck" type="checkbox" onclick="agreesubmit(this)" />
</form>


I don't like that set-up what-so-ever.
The INPUT TAG does not have an ONSUBMIT event, only the FORM tag does.
Try executing the following code:

<form>
<input type="submit" onsubmit="return alert()" value="click me">
</form>

Ultimater
05-19-2005, 02:39 PM
The following would actually submit your form:

<form name="agreeform"
onsubmit="return function(){if(!defaultagree(this))return false;document.orderform_16180.submit();return true}">
<input type="submit" name="Submit2" disabled value="Add Order to Cart" >
<input name="agreecheck" type="checkbox" onclick="agreesubmit(this)" />
</form>

LocalHero
05-19-2005, 02:47 PM
Thanks for catching those. They are mostly modifications on top of modifications that haven't been cleaned up yet.

LocalHero
05-19-2005, 02:54 PM
I think many of those are good ideas that I will add. As for the having a bunch of forms on the page... I was going to merge them all together, but had been running into problems like this. What would you suggest doing to change the price curves? Would it just be better to put all three into one function? Do you know why the first idea wouldn't work?

Ultimater
05-19-2005, 03:15 PM
Unless you re-write your whole script from scratch, :( , I see no harm in using multipul forms. If you wish, you could even use a hidden FORM that would be submited dynamicly and populate all of its hidden input fields prior to submiting to control what will be sent where and how.

Palros
05-19-2005, 05:44 PM
try onclick instead of onchange or onsubmit.

LocalHero
05-19-2005, 08:11 PM
Well, thanks for spending some time to help me. I really appreciate it.