jquery - Display results on keyup event and values inside form how to? -
how display output on keyup event rather on submit , values inside input fields?
i tried readonly <input id="result" name="totalamount" value="" readonly/>
but not working. can helo?
here thew complete codes
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <script> $('#myform').submit(function (event) { event.preventdefault(); var actualprice = number($("#actualprice").val().trim()); var discount = number($("#discount").val().trim()); var shipping = number($("#shipping").val().trim()); var discountrate = (100 - discount) / 100; var result = (actualprice * discountrate) + shipping; $("#result").html("result :" + result.tofixed(2)); }); </script> <form id="myform"> <input id="actualprice" type="number" placeholder="actual price"> <input id="discount" type="number" placeholder="discount"> <input id="shipping" type="number" placeholder="shipping"> <input id="result" name="totalamount" value="" readonly/> <h3 id="result"></h3> <input type="submit" value="submit"> </form>
use keyup
event input
, using same id
result
input
, h3
. i've changed id
of h3
result2
.
$('input').on('keyup input', function () { var actualprice = number($("#actualprice").val().trim()); var discount = number($("#discount").val().trim()); var shipping = number($("#shipping").val().trim()); var discountrate = (100 - discount) / 100; var result = (actualprice * discountrate) + shipping; $("#result").val("result :" + result.tofixed(2)); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="myform"> <input id="actualprice" type="number" placeholder="actual price"> <input id="discount" type="number" placeholder="discount"> <input id="shipping" type="number" placeholder="shipping"> <input id="result" name="totalamount" value="" readonly /> <h3 id="result2"></h3> <input type="submit" value="submit"> </form>
Comments
Post a Comment