This week's book giveaway is in the Servlets forum.
We're giving away four copies of Murach's Java Servlets and JSP and have Joel Murach on-line!
See this thread for details.
The moose likes HTML, CSS and JavaScript and the fly likes A question of Sums Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Murach's Java Servlets and JSP this week in the Servlets forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "A question of Sums" Watch "A question of Sums" New topic
Author

A question of Sums

Mike Hamill
Greenhorn

Joined: Apr 14, 2006
Posts: 2
Hi
I run a small website for ex members of an RAF Squadron. We would like to offer items for sale on the site but do not want to go down the route of a shopping trolly scenario where by we have to deal with electronic cash payments. To this end I have done a small page that has a table. I would like to be able to present the prospective purchaser with a total cost per item and at the end of their shopping trip the total cost of all goods. I was wondering if anyone could help me with the code

i.e one field is item quantity the other is item total so the math is x*y is simple, even this old grey hair. I can work that out, but how do I make it look pretty on the site?

I have tried to do it using the form calculator jbot in frontpage, but this throws up an error when I try to launch it while in a field in the table.

Below is the web page relating to the table. Apologies to the purists who know all the ins and outs, and think it's untidy stuff, but I am just learning css etc and rather late into the game.




<style type="text/css" media="screen">
.datatable {
border: 1px solid #D6DDE6;
border-collapse: collapse;
width: 10%;
}

.datatable caption {
color: #33517A;
font: bold 1.2em Arial, Helvetica, sans-serif;
padding-bottom: 8px;
padding-top: 3px;
text-align: left;
}

.datatable td {
border: 1px solid #D6DDE6;
padding: 4px;
}

.datatable th {
background-color: #BCBCBC;
border: 1px solid #828282;
color: Navy;
font: sans-serif;
font-style: italic;
text-align: center;
font-weight: bold;
padding-left: 4px;
}

.datatable tr.altrow {
background-color: #FFFFBB;
color: Navy;
font: sans-serif;
font-style: oblique;
text-align: justify;
font-weight: bold;
padding-left: 4px;
}
</style>

</head>



<body>
<img src="images/sqnshop.jpg" style="margin-left: 10em;" />
<h1 style="color: #0002DD; text-align: center;">Welcome to the 202 Squadron Shop</h1>
<div id="side1">
<h3>Navigation</h3>
<ul>
<li><a href="">Home Page</a></li>
<li><a href="">Squadron History</a></li>
<li><a href="">Association Scrapbook</a></li>
<li><a href="l">The Line Book</a></li>
<li><a href="l">The Mucky Duck</a></li>
<li><a href="l">Members Directory</a></li>
<li><a href="">Requests For Assistance</a></li>
<li><a href="">Constitution & Committee</a></li>
<li><a href=">Contact us</a></li>
<li><a href="">Links To Friends & Associates</a></li>
</ul>
</div>
<div id="content">

With the exception of any items marked "Squadron Only", these items are offered for sale to all visitors to the site.

Please Note: These items are offered by kind permission of the Officer Commanding 202 Squadron. The Squadron do not undertake on line payments. All transactions must be by a cheque for the correct amount in sterling and encashable at a UK bank. Goods will not be sent until confirmation that the cheque has cleared and the requisite funds are deposited in their account. There will be no relaxation of these rules

<form method="post" action="action="http://www/">
<table summary="202 Squadron Shop Price List" class="datatable" style="font-family: Verdana, Arial, sans-serif; font-size: 1em; ">
<tr>
<th scope="col">Item</th>
<th scope="col">Item Cost</th>
<th scope="col">Qty Req'd</th>
<th scope="col">Total Item Cost</th>
</tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;">
<td>Engraved Sqn Tankard</td><td>�16.00</td><td><span><label for="tankard"></label><input type="text" name="tankard" id="tankard" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td><td><span><label for="tankcost"></label><input type="text" name="tankcost" id="tankcost" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr><tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Squadron Tie</td><td>�6.00</td><td><span><label for="tie"></label><input type="text" name="tie" id="tie" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td>
<td><span><label for="tiecost"></label><input type="text" name="tiecost" id="tiecost" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Sqn Plaque</td><td>�21.00</td><td><span><label for="plaque"></label><input type="text" name="plaque" id="plaque" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td><td><span><label for="plaquecost"></label><input type="text" name="plaquecost" id="plaquecost" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Squadron Cummerbund</td><td>�20.00</td><td><span><label for="cummerb"></label><input type="text" name="cummerb" id="cummerb" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td>
<td><span><label for="cummerbcost"></label><input type="text" name="cummerbcost" id="cummerbcost" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr><tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Sqn Print</td><td>�7.50</td>
<td><span><label for="sqnprint"></label><input type="text" name="sqnprint" id="sqnprint" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td>
<td><span><label for="printcost"></label><input type="text" name="printcost" id="printcost" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Squadron Cufflinks</td><td>�6.00</td><td><span><label for="cufflinks"></label><input type="text" name="cufflinks" id="cufflinks" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td>
<td><span><label for="cuffcosts"></label><input type="text" name="cuffcost" id="cuffcost" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr><tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Squadron Tiepins</td><td>�4.00</td>
<td><span><label for="tiepins"></label><input type="text" name="tiepins" id="tiepins" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td>
<td><span><label for="tiepincosts"></label><input type="text" name="tiepincosts" id="tiepincosts" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Bookmark (Photo & Sqn history)</td><td>�1.00</td><td><span><label for="bookmark"></label><input type="text" name="bookmark" id="bookmark" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td><td><span><label for="bookmarkcosts"></label><input type="text" name="bookmarkcosts" id="bookmarkcosts" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Sea King Postcard</td><td>�0.25</td><td><span><label for="postcard"></label><input type="text" name="postcard" id="postcard" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td><td><span><label for="postcardcosts"></label><input type="text" name="postcardcosts" id="postcardcosts" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>
<tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;">
<td>Total Unit Cost</td><td></td><td></td><td><span><label for="totalcostscosts"></label><input type="text" name="totalcosts" id="totalcosts" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span>
</td></tr><tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Postage & Packing</td><td></td><td></td>
<td><span><label for="postandpack"></label><input type="text" name="postandpack" id="postandpack" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr><tr class="altrow" style="font-family: Verdana, Arial, sans-serif; font-size: 0.7em;"><td>Amount Due</td><td></td><td></td><td><span><label for="amount_due"></label><input type="text" name="amount_due" id="amount_due" size="3" style="font-family: Arial; font-size: 1em; font-weight: bold" /></span></td></tr>

<label for="Forename">Please enter your first name: </label><input type="text" name="Forename" id="Forename" size="25" style="font-family: Verdana,Arial,sans-serif; font-size: 0.8em; font-weight: bold;" /><br />

<label for="Surname">Please enter your surname: </label><input type="text" name="surname" id="surname" size="25" style="font-family: Verdana,Arial,sans-serif; font-size: 0.8em; font-weight: bold" />

<label for="email_address">Please enter your e-mail address: </label><input type="text" name="email" id="email_address" size="80" style="font-family: Verdana,Arial,sans-serif; font-size: 0.8em; font-weight: bold" />

<input type="hidden" name="subject" value="202 Squadron Giftshop Order" />
<input type="hidden" name="required" value="email,surname " />
<input type="hidden" name="redirect" value="http://www" />
<input class="green" type="submit" value="Send Order"/> <input class="red" type="reset" value="Cancel Order"/>
</form>
</div>

<div id="side2">
<h3></h3>
</div>

</body>
</html>

Any suggestions will be gratefully received

Cheers


Many Thanks<br />Mike
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Look at this:

http://radio.javaranch.com/pascarello/2005/03/03/1109875838282.html
Eric
Mike Hamill
Greenhorn

Joined: Apr 14, 2006
Posts: 2
Thanks Eric, While I am not sure I understand all the technical wizadry I think I understand the principles. However, for clarification, Do I need to put a version of that script after every entry in the table and again at the last entry(s) for the final calculation?

If you need to see the page in it's glory go here

http://www.202-sqn-assoc.co.uk/sqnshop_1.html

And one for the bar

A neutron walks into a bar. "I'd like a beer" he says.
The bartender promptly serves up a beer.
"How much will that be?" asks the neutron.
"For you?" replies the bartender, "no charge"


Mike

[ April 14, 2006: Message edited by: Mike Hamill ]
[ April 14, 2006: Message edited by: Mike Hamill ]
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: A question of Sums
 
Similar Threads
Action Errors and style class
TD Width
Nested datatables and inputText with duplicates id
JSP Page to know what it does
Change Disabled Button Label Text and Its Shade Color