By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,827 Members | 2,177 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,827 IT Pros & Developers. It's quick & easy.

Radio button changing a value

P: n/a
I am trying to change the value of the variable "hard" according to
which radio button is pressed and I am having no joy. Could anyone
help me with this, the problematic section is marked with
***********************, I've included all the code incase that isn't
where the problem is.

Any help would be hugely appreciated.

Mick

<HTML>
<HEAD>
<TITLE>Products List</TITLE>
<SCRIPT LANGUAGE="JavaScript">
var items = new Array(10);
var numitems = 0;
function Item(d,c,q,w,h) {
this.desc = d;
this.price = c;
this.quantity = q;
this.wrap = w;
this.hard = h;
}
function additem(desc,price,quantity,wrap,hard) {
items[++numitems] = new Item(desc,price,quantity,wrap,hard);
displaycart();
}

function removeitem() {
///confirms the removal of the last item
if (confirm("\nAre you sure?\n")) {
(numitems--);
displaycart();
}
}

function displaycart() {
var totalcost=0;
with (parent.cart.document) {
open();
write("<HTML><BODY>");
write("<H1>Shopping Cart</H1><HR>");
if (numitems==0) {
write("No items ordered.");
close();
return;
}
write("<TABLE BORDER=1><FORM NAME='form1'>");
for(i=1;i<=numitems;i++) {
write("<TR><TD>");
//the following input box has been modified so that the
//quantity cannot be altered
write("<INPUT NAME='qty' TYPE='TEXT' onfocus='this.disabled=true'
SIZE=2 VALUE=");
write(items[i].quantity + ">");
write("<TD>" + items[i].desc);
write("<TD>" + items[i].price);
write("<TD>" + (items[i].price * items[i].quantity));
write("<TD>back" +(items[i].hard));
///////////////
write("<TR>");
write("<TD bgcolor='silver'>");
write("<TD><p>wrap cost</p>");
write("<TD>HARD " +(items[i].hard));
write("<TD>");
write("<TD>" + (items[i].wrap));
////////////////
// write("<TD>" + (items[i].picture);
write("</TR>\n");
totalcost += (items[i].price *
items[i].quantity+items[i].wrap);
}
totalcost = Math.floor(totalcost*100) /100;
write("<TR><TD COLSPAN=3><B>Total Cost:</B>");
write("<TD>" + totalcost);
write("</TABLE>");
write("<INPUT TYPE=BUTTON VALUE='Update'");
write("onClick='parent.products.updatecart();'>");
write("<INPUT TYPE=BUTTON VALUE='Complete Order'");
write("onClick='parent.products.complete();'>");
//removeitem button
write("<INPUT TYPE=BUTTON VALUE='Remove last item'");
write("onClick='parent.products.removeitem();'>");

write("</FORM></HTML>");
close();
<!--
//currency button
//<form onClick="currency=getRadioValue(this.op_sys);self. alert('The
conversion rate from Sterling is '+currency );">
//<input type="RADIO" name="op_sys" value="1"> Sterling<br>
//<input type="RADIO" name="op_sys" value="1.8248"> Dollar<br>
//<input type="RADIO" name="op_sys" value="1.3662"> Euro<br>
-->
}
}
function updatecart() {
for (i=1; i<=numitems;i++) {
if (numitems == 1)
items[i].quantity = parent.cart.document.form1.qty.value;
else items[i].quantity = parent.cart.document.form1.qty[i-1].value;
}
displaycart();
}

function complete() {
OrdWin=window.open('cart_complete.htm','OrdWin');
}

function wrapping(selectObject){
var val;
var si=selectObject.selectedIndex;
if (si<0) val=null;
else val=selectObject.options[si].value;
return val;

}
</SCRIPT>
</HEAD>
<BODY onLoad="displaycart();">
<IMG SRC="logo.gif" alt="The Good Sports Guide"><BR>
<H1>Products</H1>
<table border="3">

<th colspan="4">The following products are available online. Click the
ORDER NOW link to order a product.</th>
<tr>
<td>
<P><B>The Good Tennis Guide</B></P>
</td>
<td>

//////////////
<script>
function getRadioValue(radioObject) {
var val = null;

for (var i=0; i<radioObject.length;i++) {
if (radioObject[i].checked) val = radioObject[i].value;
}
return val;
}
</script>


</form>
<B>Price:</B>

</td>

<td>
//////
<p>
<script>
wrap=0;

</script>
<select name="bookwrapping"
onchange="if(this.selectedIndex)wrap=+(this[this.selectedIndex].value);">
<option value="not selected" selected disabled></option>
<option value ="0">none</option>
<option value="2.95">Standard Wrapping</option>
<option value="3.95">Deluxe Wrapping</option>

************************************************** *****************************************
<p>Please enter the type of book that you wish to purchase:</p>

<input type="radio" name="radiobutton" value="0"
onclick"if(this.selectedIndex)hard=+(this[this.selectedIndex].value);"/>
<label>Hard Back</label>
<input type="radio" name="radiobutton" value="3"
onclick"if(this.selectedIndex)hard=+(this[this.selectedIndex].value);"/>

<label>Paper Back</label>

</td>

<td>
<INPUT TYPE="BUTTON" VALUE='Add to Cart'
onClick="javascript:additem('tennis', 5.95,1,wrap,hard);");>
</td>
<td>
<img src="image1.gif" width="50" length="75" alt="The Good Tennis
Guide"></A>
</td>
</tr>
<!--
<tr>
<td>
<P><B>The Good Football Guide</B> </P>
</td>
<td>
<B>Price: 5.95</B>
</td>
<td>
<p>test</p>
</td>
<td>
<INPUT TYPE="BUTTON" VALUE='Add to
Cart'onClick="javascript:additem('footie', 5.95,1);");>
</td>
<td>
<img src="image2.gif" width="50" length="75" alt="The Good
Football Guide"></A>
</td>

</tr>

<tr>
<td>
<P><B>The Good Golf Guide RRP: 5.95</B> </P>
</td>
<td>
<B>Price: 5.95</B>
</td>
<td>
<p>test</p>
</td>
<td>
<INPUT TYPE="BUTTON" VALUE='Add to
Cart'onClick="javascript:additem('golf', 5.95,1);");>
</td>
<td>
<img src="image3.gif" width="50" length="75" alt="The Good Golf
Guide"></A>
</td>
</tr>

-->
</table>

</BODY>
</HTML>
Jul 23 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
MickG wrote:
I am trying to change the value of the variable "hard" according to
which radio button is pressed and I am having no joy. Could anyone
help me with this, the problematic section is marked with
***********************, I've included all the code incase that isn't
where the problem is.

Any help would be hugely appreciated.

Mick

<HTML>
<HEAD>
<TITLE>Products List</TITLE>
<SCRIPT LANGUAGE="JavaScript">
The script language attribute is depreciated, use type

<script type="text/javascript">
[...] }
write("<TABLE BORDER=1><FORM NAME='form1'>");
Quotes around attribute values are not essential under most
conditions, however it is generally a good practice to include
them for all attributes.

write("<TABLE BORDER='1'><FORM NAME='form1'>");

for(i=1;i<=numitems;i++) {
write("<TR><TD>");
//the following input box has been modified so that the
//quantity cannot be altered
write("<INPUT NAME='qty' TYPE='TEXT' onfocus='this.disabled=true'
SIZE=2 VALUE=");
Do not use tabs when posting code. Use 1 or 2 spaces for
indenting and manually wrap code at about 65 characters:

for(i=1;i<=numitems;i++) {
write("<TR><TD>");
//the following input box has been modified so that the
//quantity cannot be altered
write("<INPUT NAME='qty' TYPE='TEXT' "
+ "onfocus='this.disabled=true'> SIZE='2' VALUE=");
write(items[i].quantity + ">");
write("<TD>" + items[i].desc);
write("<TD>" + items[i].price);
write("<TD>" + (items[i].price * items[i].quantity));
write("<TD>back" +(items[i].hard));
///////////////
write("<TR>");
write("<TD bgcolor='silver'>");
write("<TD><p>wrap cost</p>");
write("<TD>HARD " +(items[i].hard));
write("<TD>");
write("<TD>" + (items[i].wrap));
This will generate invalid HTML - where are the closing tags?
It will likely render OK in most browsers though.

[...]
write("</FORM></HTML>");
close();
<!--
These are comment markers for HTML, not JavaScript. Use /* */
for blocks or // for lines.
//currency button
//<form onClick="currency=getRadioValue(this.op_sys);self. alert('The
conversion rate from Sterling is '+currency );">
If this is wrapped in your code, it will cause an error.
//<input type="RADIO" name="op_sys" value="1"> Sterling<br>
//<input type="RADIO" name="op_sys" value="1.8248"> Dollar<br>
//<input type="RADIO" name="op_sys" value="1.3662"> Euro<br>
-->
}
}
function updatecart() {
for (i=1; i<=numitems;i++) {
You have used 'i' in multiple functions as a global but with
local context. This is somewhat dangerous, if it's a local,
keep it local

for (var i=1; i<=numitems;i++) {

if (numitems == 1)
items[i].quantity = parent.cart.document.form1.qty.value;
else items[i].quantity = parent.cart.document.form1.qty[i-1].value;
}
For simpler code maintenance, it is good to include all braces:

if (numitems == 1){
items[i].quantity = parent.cart.document.form1.qty.value;
} else {
items[i].quantity =
parent.cart.document.form1.qty[i-1].value;
}
[...] //////////////
<script>
<script type="text/javascript>
function getRadioValue(radioObject) {
var val = null;

for (var i=0; i<radioObject.length;i++) {
if (radioObject[i].checked) val = radioObject[i].value;
}
return val;
}
The following will be a much faster version of the above:

function getRadioValue(radioObject) {
var i = radioObject.length, val = null;
while (i--) {
if (radioObject[i].checked){
return radioObject[i].value;
}
}
// Should never reach here since one button must always
// be checked, but just in case...
return val;
}
[...]
************************************************** *****************************************
<p>Please enter the type of book that you wish to purchase:</p>

<input type="radio" name="radiobutton" value="0"
onclick"if(this.selectedIndex)hard=+(this[this.selectedIndex].value);"/>
<label>Hard Back</label>
<input type="radio" name="radiobutton" value="3"
onclick"if(this.selectedIndex)hard=+(this[this.selectedIndex].value);"/>
You have syntax errors in your onclick code, and the '/' on you
tag ends is for XHTML, not HTML, so don't use them.

Try:

<input type="radio" name="radiobutton" value="0" onclick="
if(this.selectedIndex) {
hard = +(this[this.selectedIndex].value);
}
">
<label>Hard Back<label>
<input type="radio" name="radiobutton" value="3" onclick=
"if(this.selectedIndex) {
hard = +(this[this.selectedIndex].value);
}
">

<label>Paper Back</label>

</td>

<td>
<INPUT TYPE="BUTTON" VALUE='Add to Cart'
onClick="javascript:additem('tennis', 5.95,1,wrap,hard);");>


javascript pseudo protocol is not required, ditch the extra ';'

onClick="additem('tennis', 5.95,1,wrap,hard);")>
[...]

There may be other errors... see how you go.
--
Rob
Jul 23 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.