Excel formula on a web page?

mildmanneredjanitor · 8 Jul 2004

How do I incorporate a spreadsheet into a web page?

I want to create a conversion table on a web page where you can enter a value and the web displays a new value based on the data you have entered.

Is this straight forward???

TexMex · 8 Jul 2004

Embedding XL spreadsheets within HTML would make it only viewable by clients with compatible version(s) of Excel installed. This would limit your audience. Why not use a bit of javascript to the same end. For example

<script language="JavaScript">
function recalculate()
{
result.value=Number(first.value) * Number(second.value);
}
</script>
<html>
<head>
</head>
<body>
<input type="text" name="first" >
<input type="text" name="second">
<input type="text" name="result"><br>
<input type="button" value="GetResult" OnClick="recalculate()">
</body>
</html>

mildmanneredjanitor · 10 Jul 2004

Cheers Tex, worked a treat!

had to edit all the text as the brackets appeared as "ctrl" etc!

Then just inserted into web page in html view mode, (I'm a frontpage man).

If I wanted to insert a preset value into the second box, what would the syntax be??

Thanks for the help!

TexMex · 10 Jul 2004

instead of:
<input type="text" name="second">
simply
<input type="text" name="second" value="whatever">

pipme · 10 Jul 2004

Bit off the thread but try this, probably the best free calculator on the Web !! the CONVersions are brilliant .... Look here

P

mildmanneredjanitor · 12 Jul 2004

Cheers Tex, worked a treat!

TexMex · 13 Jul 2004

Just a few of points.

If you copy and paste directly into the HTML view, you shouldn't need all the editing.

If you don't want the user to change the value in the second box you can just use the required value in the calculation without it appearing on the page.

If you really want the page to behave like Excell (auto updating calculated values) you can use the OnChange event to trigger the recalculation.

Finally you can give the whole thing a more spreadsheet look by putting the input boxes into a table.

eg.

<script language="JavaScript">

function recalculate()
{
dozbox.value=Number(first.value) * 12;
vat.value=parseInt(Number(first.value) * 17.5)/100;
total.value=Number(vat.value) + Number(dozbox.value);
}

</script>
<html>
<head>
</head>
<body>

<table border="1">
<tr><td>price each</td><td>per doz</td><td>VAT</td><td>gross per doz</td></tr>

<tr><td><input type="text" name="first" OnChange="recalculate()" ></td>
<td><input type="text" name="dozbox"></td>
<td><input type="text" name="vat"></td>
<td><input type="text" name="total"></td>
</table>

</html>

TexMex · 13 Jul 2004

I've just noticed that I c****ed up my last example. only calculates the VAT for one then adds it to the total.

vat.value=parseInt(Number(first.value) * 17.5)/100;
should have read
vat.value=parseInt(Number(dozbox.value) * 17.5)/100;

Also could do with some work on the format. (doesn't show trailing 0s after decimal point)

but you get the idea.