Jump to content
djoez

button error

Recommended Posts

I'm quite new at html scripting so i'm all sorts of stuff i've made a submit form (http://wduizer.nl/basic_web_development/index2.php)

 

Now for my problem.. I made a small calculator (http://wduizer.nl/basic_web_development/probeersel/rekenen.php).

When i fill in the numbers and hit a function button with the mouse the form clears and i'll get no answer, but when i'll fill it out and go to a button using tab and enter it works like a charm?!?

 

Can someone please tell me why?

 

this is the script i've used for the front form:

<html>
<body>
<form action="resultaat.php" method="post">
<table>
<tr>
<td>getal 1:</td><td> <input type="tekst" name="getal_1"></td>
</tr>
<tr>
<td>bewerking (+-/*)</td><td> <input type="tekst" name="bewerking"></td>
</tr>
<tr>
<td>getal 2:</td><td> <input type="tekst" name="getal_2"></td>
</tr>
<tr>
<td> <input type="submit"> </td>
</tr>
</html>
</body>
and this for the calculation (+):
<html>
<body style="background-color:#333399;">
<p style="font-family:arial;color:#999999;font-size:500px;"> <?php echo $_POST["getal1"] + $_POST["getal2"] ; ?></p>
</html>
</body>
Edited by djoez

Share this post


Link to post
Share on other sites

I don't know about your php code, but your HTML code had a lot of errors. Here is the corrected HTML code:

<!DOCTYPE html><html><head>	<title>Page Title</title>	<meta charset="UTF-8">	</head><body>	<form action="resultaat.php" method="post">		<table>			<tr>				<td>getal 1:</td><td> <input type="text" name="getal_1"></td>			</tr>			<tr>				<td>bewerking (+-/*)</td><td> <input type="text" name="bewerking"></td>			</tr>			<tr>				<td>getal 2:</td><td> <input type="text" name="getal_2"></td>			</tr>			<tr>				<td colspan="2"> <input type="submit" value="Submit!"> </td>			</tr>		</table>	</form>	</body></html>
<!DOCTYPE html><html><head>	<title>Page Title</title>	<meta charset="UTF-8"></head><body style="background-color:#333399;"> <p style="font-family:arial;color:#999999;font-size:500px;"> <?php echo $_POST["getal1"] + $_POST["getal2"] ; ?></p> </body></html>

Share this post


Link to post
Share on other sites

in your script it is only possible to add.

What i'm trying to accomplish is to use all possible calculation types at the touch of a button.

In other words, i want to make more than one button with different functions. ( 1st +, 2nd -, 3th * and 4th /)

Edited by djoez

Share this post


Link to post
Share on other sites

I wrote this about a year ago. I don't remember if it works or not...

<!DOCTYPE html><html><head><title>Calc</title><style>body {width: 300px;margin: 0 auto;text-align: center;}img {border:10px groove gray;}#out0,#out1,#out2,#out3 {text-align: right;}#err {color: red;}button{width: 35px;}#enter {width: 60px;}</style><script>var lastkey = "";window.onload=function(){$("btn1").onclick=fn1;$("btn2").onclick=fn1;$("btn3").onclick=fn1;$("btn4").onclick=fn1;$("btn5").onclick=fn1;$("btn6").onclick=fn1;$("btn7").onclick=fn1;$("btn8").onclick=fn1;$("btn9").onclick=fn1;$("btn0").onclick=fn1;$("dec").onclick=fn1;$("clr").onclick=fnClr;$("cx").onclick=fnCX;$("cy").onclick=fnCX;$("cz").onclick=fnCX;$("ct").onclick=fnCX;$("enter").onclick=fnEnter;$("add").onclick=fnAdd;$("sub").onclick=fnSub;$("mul").onclick=fnMul;$("div").onclick=fnDiv;init();}function fn1(event){if (lastkey!=""){$("out0").value = "";}lastkey="";var elem=event.target;var txt=$("out0").value;$("out0").value = txt + elem.value;}function fnClr(){$("out0").value = "";$("out1").value = "";$("out2").value = "";$("out3").value = "";$("err").innerHTML = "";}function fnCX(event){var elem=event.target;if (elem.value=='CX'){$("out0").value = "";}else if (elem.value=='CY'){$("out1").value = "";}else if (elem.value=='CZ'){$("out2").value = "";}else if (elem.value=='CT'){$("out3").value = "";}$("err").innerHTML = "";}function fnEnter(){lastkey="ent";$("out3").value = $("out2").value;$("out2").value = $("out1").value;$("out1").value = $("out0").value;$("err").innerHTML = "";}function fnAdd(){lastkey="add";$("err").innerHTML = "";try{var x = Number($("out0").value);var y = Number($("out1").value);var z = x + y;}catch(e){$("err").innerHTML = "Error: " + e.message;return;//abort}$("out0").value = z;$("out1").value = $("out2").value;$("out2").value = $("out3").value;$("out3").value = "";}function fnSub(){lastkey="sub";$("err").innerHTML = "";try{var x = Number($("out0").value);var y = Number($("out1").value);var z = y - x;}catch(e){$("err").innerHTML = "Error: " + e.message;return;//abort}$("out0").value = z;$("out1").value = $("out2").value;$("out2").value = $("out3").value;$("out3").value = "";}function fnMul(){lastkey="mul";$("err").innerHTML = "";try{var x = Number($("out0").value);var y = Number($("out1").value);var z = x * y;}catch(e){$("err").innerHTML = "Error: " + e.message;return;//abort}$("out0").value = z;$("out1").value = $("out2").value;$("out2").value = $("out3").value;$("out3").value = "";}function fnDiv(){lastkey="div";$("err").innerHTML = "";try{var x = Number($("out0").value);var y = Number($("out1").value);var z = y/x;}catch(e){$("err").innerHTML = "Error: " + e.message;return;//abort}$("out0").value = z;$("out1").value = $("out2").value;$("out2").value = $("out3").value;$("out3").value = "";}function $(id){return document.getElementById(id);}function init(){$("out").value = "";$("err").innerHTML = "";}</script></head><body><h1>RPN Calculator</h1><img src="http://www.hrsolutionsinc.com/engagementcalculator/calculator.jpg" width="100" alt="Logo"/><br/><br/><input type="text" id="out3"/> <button id="ct" value="CT">CT</button><input type="text" id="out2"/> <button id="cz" value="CZ">CZ</button><input type="text" id="out1"/> <button id="cy" value="CY">CY</button><input type="text" id="out0"/> <button id="cx" value="CX">CX</button><hr/><button id="btn1" value="1">1</button><button id="btn2" value="2">2</button><button id="btn3" value="3">3</button>  <button id="clr">C</button><br/><button id="btn4" value="4">4</button><button id="btn5" value="5">5</button><button id="btn6" value="6">6</button>  <button id="dec" value="."> . </button><br/><button id="btn7" value="7">7</button><button id="btn8" value="8">8</button><button id="btn9" value="9">9</button>  <button id="btn0" value="0">0</button><br/><hr/><button id="add">+</button><button id="sub">-</button><button id="mul">*</button><button id="div">/</button><button id="enter">ENTER</button><br/><br/><div id="err"></div></body></html>
Edited by davej

Share this post


Link to post
Share on other sites

the number buttons work. when pressed enter the number witch was putted in is copied to the field above and the + button works. but thats all

o. and the 4 buttons besides the input fields clear the field when pressed

Share this post


Link to post
Share on other sites

Yeah, I had to search to find and re-post the most recent version. I'm sure it isn't 100%, but it demonstrates a concept.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...