EDITED
Thank you for everyone who offered support... the best working script I will share with you in hope that I could help others who is looking for the same solution:
$(document).ready(function(){
$("#price1, #price2").keyup(function() {
var priceOne = parseFloat($("#price1").val());
var priceTwo = parseFloat($("#price2").val());
var rate = parseFloat($("#rate").val());
if ($("#price1").val() && $("#price2").val()){
$('#rate').val(((priceTwo - priceOne) / priceOne * 100).toFixed(2));
}
});
$("#rate").keyup(function() {
var priceOne = parseFloat($("#price1").val());
var rate = parseFloat($("#rate").val());
if ($("#rate").val() && $("#price1").val() && $("#price2").val()){
$('#price2').val(((priceOne * rate)/ 100 + priceOne).toFixed(2));
}
});
})
Also you can test it following this LINK
INITIAL QUESTION:
Please help to calculate the percentage between two numbers. I tried one way, but I did not succeed. Please tell me what is wrong, or I will appreciate if you can recommend other script which could help me
my script:
<html>
<head>
<script type="text/javascript">
$("#rate").text(function() {
var result = (parseInt(($("#price1").text(), 10) * 100)/ parseInt($("#price2").text(), 10));
if (!isFinite(result)) result = 0;
return result;
});?
</script>
</head>
<body>
<div id="price1"><label><input id="price1" type="text"></label></div>
<div id="price2"><label><input id="price2" type="text"></label></div>
<div id="rate"><label><input id="rate" type="text"></label></div>
</body>
</html>
Answer: To find the percentage of a number between two numbers, divide one number with the other and then multiply the result by 100.
Percentage Difference Formula The percentage difference between two values is calculated by dividing the absolute value of the difference between two numbers by the average of those two numbers. Multiplying the result by 100 will yield the solution in percent, rather than decimal form.
Let’s start with an easy example. Take a look at the following JavaScript code: //Our number. var number = 120; //The percent that we want to get. //i.e. We want to get 50% of 120. var percentToGet = 50; //Calculate the percent. var percent = (percentToGet / 100) * number; //Alert it out for demonstration purposes.
In mathematics, a percentage is a number or ratio that represents a fraction of 100. It is often denoted by the symbol "%" or simply as "percent" or "pct.". For example, 35% is equivalent to the decimal 0.35, or the fraction 35 100 .
Percentage Difference Formula. The percentage difference between two values is calculated by dividing the absolute value of the difference between two numbers by the average of those two numbers. Multiplying the result by 100 will yield the solution in percent, rather than decimal form. Refer to the equation below for clarification.
We then calculated the percent by multiplying that decimal number by the number that we want to get the percentage of. i.e. We multiplied 0.22 by 90, which is 19.8.
use val()
instead of text()
for input element, use $(function(){})
to wait DOM is ready. And also don't use same ID to elements.
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#price1, #price2").change(function() { // input on change
var result = parseFloat(parseInt($("#price1").val(), 10) * 100)/ parseInt($("#price2").val(), 10);
$('#rate').val(result||''); //shows value in "#rate"
})
});
</script>
</head>
<body>
<div id="price-div1"><label>price1</label><input id="price1" type="text"></div>
<div id="price-div2"><label>price2</label><input id="price2" type="text"></div>
<div id="rate-div"><label>rate</label><input id="rate" type="text">%</div>
</body>
</html>
You have few problems,
Fixed you code
Live Demo
HTML
<div id="dprice1"><label><input id="price1" type="text" value="80" /></label></div>
<div id="dprice2"><label><input id="price2" type="text" value="100" /></label></div>
<div id="drate"><label><input id="rate" type="text"></label></div>
<input id="btnCal" type="button" value="Calculate">
Javascript
$("#btnCal").click(function() {
$("#rate").val(function() {
var result = parseInt($("#price1").val()) * 100 / parseInt($("#price2").val());
if (!isFinite(result)) result = 0;
return result;
});
});
Check this fiddle
http://jsfiddle.net/j3WY3/5/
Have made some corrections:
?
as everyone says..text()
to .val()
div
and input
had same idIf you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With