We are excited to announce that the ASP.NET Forums are moving to the new Microsoft Q&A experience. Learn more >
auto calculation with multiply operation provide result without clicking on other side in window?[Answered]
1 reply
Last post Sep 01, 2020 09:29 AM by XuDong Peng
Member
55 Points
191 Posts
auto calculation with multiply operation provide result without clicking on other side in window?
Sep 01, 2020 05:45 AM|prabhjot1313|LINK
hello i have a auto calculation code using jquery i need multiply operation all working well but
when put some value in textbox 1 and textbox 2 then click on some other side in window then they provide result
my requirement is when provide some value in textbox 1 and textbox 2 they automatic provide result without clicking on some side in window
aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm8.aspx.cs" Inherits="Store.WebForm8" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<%-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>--%>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<script>
$(document).ready(function () {
$("#txt1, #txt2").change(function () {
$("#txt3").val($("#txt1").val() * $("#txt2").val());
});
});
</script>
<input type="text" id="txt1" />
<input type="text" id="txt2" />
<input type="text" id="txt3" />
</div>
</form>
</body>
</html>
Contributor
2350 Points
741 Posts
Re: auto calculation with multiply operation provide result without clicking on other side in win...
Sep 01, 2020 09:29 AM|XuDong Peng|LINK
Hi prabhjot1313,
According to your description, I think this is easy to implement, try to use the jQuery keyup() function.
Just like this:
<head runat="server"> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> <title></title> <script> $(document).ready(function () { $("#txt1, #txt2").keyup(function () { $("#txt3").val($("#txt1").val() * $("#txt2").val()); }); }); </script> </head> <body> <form id="form1" runat="server"> <div> <input type="text" id="txt1" /> <input type="text" id="txt2" /> <input type="text" id="txt3" /> </div> </form> </body>Result:
As you can see, after I input the data, the result will be calculated automatically in the third input box without clicking anywhere else on the page.
Best regards,
Xudong Peng