Calculate percentage Javascript

Question

I have a question about javascript logic what I use to get percent of two inputs from my text fields. Here is my code:

    var pPos = $('#pointspossible').val();
    var pEarned = $('#pointsgiven').val();
    
    var perc = ((pEarned/pPos) * 100).toFixed(3);
    $('#pointsperc').val(perc);

For some reason if my inputs are 600 and 200, my result suppose to be 33.333 but I'm getting 3.333. If I hard code my values this works fine. If anyone can help I appreciate that.

are you sure pPos and pEarned are those values? – michelem Jun 18 '15 at 17:38 — michelem, Jun 18 '15 at 17:38

score 117 · Answer 1 · answered Feb 17 '18 at 12:36

117

You can use this

function percentage(partialValue, totalValue) {
   return (100 * partialValue) / totalValue;
}

Example to calculate the percentage of a course progress base in their activities.

const totalActivities = 10;
const doneActivities = 2;

percentage(doneActivities, totalActivities) // Will return 20 that is 20%

answered Feb 17 '18 at 12:36

Bruno Quaresma

9,457
7
32
50

8

Just a note: this will return `NaN` if `partialValue = 0` and `totalValue = 0` – Siddhartha Chowdhury Mar 02 '21 at 12:39

score 25 · Answer 2 · edited May 07 '20 at 07:49

25

Try:

const result = Math.round((data.expense / data.income) * 100)

edited May 07 '20 at 07:49

Sergey Shubin

3,040
4
24
36

answered May 07 '20 at 03:28

Sunny Vakil

362
4
7

Vikash · Accepted Answer · 2015-06-18T19:55:47.247

19

It seems working :

HTML :

 <input type='text' id="pointspossible"/>
<input type='text' id="pointsgiven" />
<input type='text' id="pointsperc" disabled/>

JavaScript :

    $(function(){

    $('#pointspossible').on('input', function() {
      calculate();
    });
    $('#pointsgiven').on('input', function() {
     calculate();
    });
    function calculate(){
        var pPos = parseInt($('#pointspossible').val()); 
        var pEarned = parseInt($('#pointsgiven').val());
        var perc="";
        if(isNaN(pPos) || isNaN(pEarned)){
            perc=" ";
           }else{
           perc = ((pEarned/pPos) * 100).toFixed(3);
           }

        $('#pointsperc').val(perc);
    }

});

Demo : http://jsfiddle.net/vikashvverma/1khs8sj7/1/

edited Jun 18 '15 at 19:55

answered Jun 18 '15 at 17:38

Vikash

1,109
1
12
19

What if values are empty? – espresso_coffee Jun 18 '15 at 17:40
for that you need to check first. I have just given you a POC that it works. – Vikash Jun 18 '15 at 17:42
I had that already. I do not need hard coded values. Thanks anyway. – espresso_coffee Jun 18 '15 at 17:43
Then how you are getting value 3.333? – Vikash Jun 18 '15 at 17:45
I do not know, that's the issue. I'm passing entered values from input field and I'm getting that output. – espresso_coffee Jun 18 '15 at 17:48
Do you know how to reset this function every time after I click on my input text field? Thanks in advance. – espresso_coffee Jun 18 '15 at 19:35
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/80929/discussion-between-vikash-and-user3023588). – Vikash Jun 18 '15 at 19:36

Samuca · Answer 4 · 2020-02-01T21:29:15.613

17

To get the percentage of a number, we need to multiply the desired percentage percent by that number. In practice we will have:

function percentage(percent, total) {
    return ((percent/ 100) * total).toFixed(2)
}

Example of usage:

const percentResult = percentage(10, 100);
// print 10.00

.toFixed() is optional for monetary formats.

edited Feb 01 '20 at 21:29

answered Nov 18 '19 at 12:21

Samuca

187
2
5

1

A bit condescending for an answer. – Tanveer Badar Nov 18 '19 at 12:41
2

toFixed() will type case the value into a string. – jefelewis Dec 03 '20 at 17:42
@jefelewis: You can wrap the result into a Number() call and get a number back, removing trailing zeroes. – Sebastian Schürmann Feb 07 '22 at 09:41

score 5 · Answer 5 · answered Aug 16 '22 at 17:26

Cool (unreadable) oneliner:

const percentage = ~~((pointsGiven / pointsPossible) * 100);

~~ is the same as Math.round()

Try it:

const pointsPossible = 600;
const pointsGiven = 200;

const percentage = ~~((pointsGiven / pointsPossible) * 100);

console.log(`Percentage: %${percentage}`)

score 4 · Answer 6 · edited Jul 19 '16 at 07:46

4

var number = 5000;
var percentX = 12;
var result;

function percentCalculation(a, b){
  var c = (parseFloat(a)*parseFloat(b))/100;
  return parseFloat(c);
}

result = percentCalculation(number, percentX); //calculate percentX% of number

edited Jul 19 '16 at 07:46

3rik82

45
7

answered Nov 15 '15 at 04:59

M.A.K. Ripon

2,070
3
29
47

score 2 · Answer 7 · answered Oct 27 '22 at 14:57

2

try

function percent(quantity, percent)
{
    return (quantity * percent) / 100;
}

   console.log(percent(40,10))

answered Oct 27 '22 at 14:57

MRAH

151
3

score 0 · Answer 8 · answered Jul 30 '18 at 18:48

Heres another approach.

HTML:

<input type='text' id="pointspossible" class="clsInput" />
<input type='text' id="pointsgiven"  class="clsInput" />
<button id="btnCalculate">Calculate</button>
<input type='text' id="pointsperc" disabled/>

JS Code:

function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
}


$('#btnCalculate').on('click', function() {
    var a = $('#pointspossible').val().replace(/ +/g, "");
    var b = $('#pointsgiven').val().replace(/ +/g, "");
    var perc = "0";
    if (a.length > 0 && b.length > 0) {
        if (isNumeric(a) && isNumeric(b)) {
            perc = a / b * 100;
        }
    }    
    $('#pointsperc').val(perc).toFixed(3);
});

Live Sample: Percentage Calculator

score 0 · Answer 9 · answered Mar 26 '19 at 13:50

0

function calculate() {
    // amount
        var salary = parseInt($('#salary').val());
    // percent    
        var incentive_rate = parseInt($('#incentive_rate').val());
        var perc = "";
        if (isNaN(salary) || isNaN(incentive_rate)) {
            perc = " ";
        } else {
            perc =  (incentive_rate/100) * salary;
          

        } $('#total_income').val(perc);
    }

answered Mar 26 '19 at 13:50

Zia Qureshi

11
1
4

1

Please give some explanation – executable Mar 26 '19 at 13:57

score 0 · Answer 10 · answered Dec 02 '20 at 13:36

For percent increase and decrease, using 2 different methods:

const a = 541
const b = 394

// Percent increase 
console.log(
  `Increase (from ${b} to ${a}) => `,
  (((a/b)-1) * 100).toFixed(2) + "%",
)

// Percent decrease
console.log(
  `Decrease (from ${a} to ${b}) => `,
  (((b/a)-1) * 100).toFixed(2) + "%",
)

// Alternatives, using .toLocaleString() 
console.log(
  `Increase (from ${b} to ${a}) => `,
  ((a/b)-1).toLocaleString('fullwide', {maximumFractionDigits:2, style:'percent'}),
)

console.log(
  `Decrease (from ${a} to ${b}) => `,
  ((b/a)-1).toLocaleString('fullwide', {maximumFractionDigits:2, style:'percent'}),
)

Karpi · Answer 11 · 2021-02-16T18:08:59.070

<div id="contentse "><br>
      <h2>Percentage Calculator</h2>
    <form action="/charactercount" class="align-items-center" style="border: 1px solid #eee;padding:15px;" method="post" enctype="multipart/form-data" name="form">
        <input type="hidden" name="csrfmiddlewaretoken" value="NCBdw9beXfKV07Tc1epTBPqJ0gzfkmHNXKrAauE34n3jn4TGeL8Vv6miOShhqv6O">
        <div style="border: 0px solid white;color:#eee;padding:5px;width:900px">
        <br><div class="input-float" style="float: left;"> what is <input type="text" id="aa" required=""> % of <input type="text" id="ab"> ? </div><div class="output-float"><input type="button" class="crm-submit" value="calculate" onclick="calculatea()"> &nbsp; <input type="text" id="ac" readonly="">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><br style="clear: both;"> </div><br>
        <hr><br>
        
        <div style="border: 0px solid white;color:#eee;padding:5px;width:900px">
        <div class="input-float" style="float: left;"><input type="text" id="ba"> is what percent of <input type="text" id="bb"> ? </div><div class="output-float"><input type="button" class="crm-submit" value="calculate" onclick="calculateb()"> &nbsp; <input type="text" id="bc" readonly=""> &nbsp; % </div><br style="clear: both;"></div><br>
        <hr><br>
        
        <div style="border: 0px solid white;color:#eee;padding:5px;width:900px">
        Find percentage change(increase/decrease) <br><br>
        <div class="input-float" style="float: left;">from <input type="text" id="ca"> to <input type="text" id="cb">&nbsp;?  </div><div class="output-float"><input type="button" class="crm-submit" value="calculate" onclick="calculatec()"> &nbsp; <input type="text" id="cc" readonly="">&nbsp;%</div><br style="clear: both;"></div>
    </form>
    </div>

Live example here: setool-percentage-calculator

Nadia Tariq · Answer 12 · 2021-10-25T15:05:40.990

0

how to calculate percentage with return

function sum (a,b){
 let s = a+b
 return s;
 }
 
 let total= sum(20,20)
 percentage(total);
 
 function percentage(t){
 let per = t/200*100;
 document.write(per);
 }

edited Oct 25 '21 at 15:05

answered Oct 25 '21 at 13:50

Nadia Tariq

1
1

2

As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Oct 25 '21 at 14:59

score -4 · Answer 13 · answered Mar 02 '17 at 10:31

-4

try

var result = (35.8 / 100) * 10;

Thanks

answered Mar 02 '17 at 10:31

subindas pm

2,668
25
18

@BrunoQuaresma but its worked well for me for one calculation purpose. – subindas pm Feb 21 '18 at 06:36
This is static formula and we cannot relay on static things in development. – Habib Jun 23 '19 at 09:38
you should share general formula not static values. – Maqsood Ahmed Jul 27 '21 at 12:28

Calculate percentage Javascript

13 Answers13

Linked