Can we call a java function from the html text-box?
Question
I'm doing a web project using jsp,mysql,ajax using netbeans and mysql. I'm having 3 textboxes, 2 is for taking the input from the user. The 3rd textbox should show the product of 2 input values.
How to do this? Should i make a ajax call or can i call a java function in the 3 textbox.
The code is
<input type="text" value="" name="quantity"/>
</td><td><input type="text" value="" name="price"/>
</td><td><input type="text" value="" name="total"/>
In the value attribute of the textbox named "total" can i call a java function? something like value="getTotal()" ,but if i can how can i access the other two values.
Otherwise should i make a ajax call?
4 answers
solution1
2 2012-03-01 12:09:11
If your requirement is as basic as what you are asking, you can do it with simple JavaScript. Add the following to your script
function doTheMath(){
var quantity = document.getElementById("quantity").value;
var price = document.getElementById("price").value;
var product = parseInt(quantity, 10) * parseFloat(price);
document.getElementById("total").value = product;
} and change your html to the following to call the javascript function whenever there is a change.
<input type="text" value="" id="quantity" onchange="doTheMath()"/>
Making a server call for simple math is not suggestable.
solution2
1 2012-03-01 12:15:30
You should use jQuery. With jQuery you can dynamically set the value of a text box depending on what the user types in other fields. I recently implemented this for a shopping basket I did for a client. jQuery also has a .ajax() method which is quite easy to use.
Check out these resources:
http://docs.jquery.com/How_jQuery_Works
http://api.jquery.com/category/ajax/
Sorry I do not have time to write a coded response. Hope this helps anyway.
solution3
1 ACCPTED 2012-03-01 13:48:42
Hi friend no need to go java function...You can do simply client side
<td><input type="text" value="" name="quantity" onblur="Calculate()"/>
</td><td><input type="text" value="" name="price" onblur="Calculate()"/>
</td><td><input type="text" value="" name="total"/>
<script type="text/javascript">
function Calculate()
{
var txt1 = document.getElementById("quantity");
var txt2 = document.getElementById("price");
var txt3 = document.getElementById("total");
if ((txt1.value != "") && (txt2.value != ""))
{
txt3.value = parseInt(txt1.value) * parseInt(txt2.value);
}
}
</script>
Hi friend one more thing total textbox should be read only or you can use label....
thanks
solution4
0 2012-03-01 14:18:10
<HTML>
<HEAD>
<TITLE></TITLE>
<script type="text/javascript">
function Calculate()
{
var txt1 = document.getElementById("FirstNo");
var txt2 = document.getElementById("SecondNo");
var txt3 = document.getElementById("Output");
if ((txt1.value != "") && (txt2.value != ""))
{
txt3.value = parseInt(txt1.value) * parseInt(txt2.value);
}
}
</script>
<input id="FirstNo" type="text" value="" onblur="Calculate()" style="width:50px"/> *
<input id="SecondNo" type="text" value="" onblur="Calculate()" style="width:50px"/>
<input id="Output" type="text" style="width:50px"/>
</FORM>
</BODY>
</HTML>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.