Radio button changing a value

M

MickG

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.quantity + ">");
write("<TD>" + items.desc);
write("<TD>£" + items.price);
write("<TD>£" + (items.price * items.quantity));
write("<TD>back" +(items.hard));
///////////////
write("<TR>");
write("<TD bgcolor='silver'>");
write("<TD><p>wrap cost</p>");
write("<TD>HARD " +(items.hard));
write("<TD>");
write("<TD>£" + (items.wrap));


////////////////
// write("<TD>" + (items.picture);
write("</TR>\n");
totalcost += (items.price *
items.quantity+items.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.quantity = parent.cart.document.form1.qty.value;
else items.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.checked) val = radioObject.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>
 
R

RobG

MickG said:
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">
Click to expand...

The script language attribute is depreciated, use type

<script type="text/javascript">


[...]
}
write("<TABLE BORDER=1><FORM NAME='form1'>");
Click to expand...

Quotes around attribute values are not essential under most
conditions, however it is generally a good practice to include
them for all attributes.

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=");
Click to expand...

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.quantity + ">");
write("<TD>" + items.desc);
write("<TD>£" + items.price);
write("<TD>£" + (items.price * items.quantity));
write("<TD>back" +(items.hard));
///////////////
write("<TR>");
write("<TD bgcolor='silver'>");
write("<TD><p>wrap cost</p>");
write("<TD>HARD " +(items.hard));
write("<TD>");
write("<TD>£" + (items.wrap));
Click to expand...


This will generate invalid HTML - where are the closing tags?
It will likely render OK in most browsers though.

[...]
write("</FORM></HTML>");
close();
<!--
Click to expand...

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 );">
Click to expand...

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++) {
Click to expand...

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.quantity = parent.cart.document.form1.qty.value;
else items.quantity = parent.cart.document.form1.qty[i-1].value;
}
Click to expand...


For simpler code maintenance, it is good to include all braces:

if (numitems == 1){
items.quantity = parent.cart.document.form1.qty.value;
} else {
items.quantity =
parent.cart.document.form1.qty[i-1].value;
}
[...]
//////////////
<script>
Click to expand...

function getRadioValue(radioObject) {
var val = null;

for (var i=0; i<radioObject.length;i++) {
if (radioObject.checked) val = radioObject.value;
}
return val;
}
Click to expand...


The following will be a much faster version of the above:

function getRadioValue(radioObject) {
var i = radioObject.length, val = null;
while (i--) {
if (radioObject.checked){
return radioObject.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);"/>
Click to expand...

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);");>
Click to expand...

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.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
Uncaught ReferenceError: item is not defined at HTMLButtonElement.onclick in the: <button onclick="item.inserir()">Inserir dados</button> 1
Sort by number of characters 1
How to create a JSON array with values from DOM(HTML TABLE) when I click a button using JQuery/Javascript? 0
Javascript DOM 1
How to create a JSON array with values from DOM(HTML TABLE) when I click a button using JQuery/Javascript? 0
Only one table shows up with the information 2
Checking dynamically populated data using ajax with user entered value 5

Members online

Total: 53 (members: 2, guests: 51)
Robots: 485

Forum statistics

Threads
473,994
Messages
2,570,222
Members
46,810
Latest member
Kassie0918

Latest Threads

Top