Javascript User input Average GPA calculator

Question

I am trying to develop a user input gpa calculator with the help of javascript. Logic is that, User can only enter A,B,C,D,F value. Then it will calculate the average result with pop up. If result 3.50 or above then pop up average result with congratulation else sorry with average result.

I was trying to solve it from 2 days. But no luck. Can you give me any hints to solve this? If I enter value, it shows NaN, but if I keep empty, then it shows 0.

JSFiddle: https://jsfiddle.net/jL8p1g80/

<!DOCTYPE html>
    <html>
    <head>
        <title>GPA Calculation </title>
    </head>
    <body>


    <!-- Calculator html design start from here --> 


        <hr>
        <br>
        <h2>GPA Calculation</h2>
        <h3>Here use GPA Scale: A = 4; B = 3; C = 2; D = 1; F = 0</h3>

        <br>
    <CENTER>

    <!-- This is html form -->  
    <FORM Name="GPACalcForm">
    <TABLE BORDER=5 BGCOLOR=#C0C0C0 CELLPADDING="5" 
    CELLSPACING="2">
    <TH></TH>
    <TH>Grade</TH>

    <TR>
    <TD>Class 1</TD>
    <TD><INPUT TYPE=TEXT SIZE=5 NAME="GR1" ALIGN=TOP 
    MAXLENGTH=5></TD>

    </TR>
    <TR>
    <TD>Class 2</TD>
    <TD><INPUT TYPE=TEXT SIZE=5 NAME="GR2" ALIGN=TOP 
    MAXLENGTH=5></TD>

    </TR>
    <TR>
    <TD>Class 3</TD>
    <TD><INPUT TYPE=TEXT SIZE=5 NAME="GR3" ALIGN=TOP 
    MAXLENGTH=5></TD>

    </TR>
    <TR>
    <TD>Class 4</TD>
    <TD><INPUT TYPE=TEXT SIZE=5 NAME="GR4" ALIGN=TOP 
    MAXLENGTH=5></TD>
    </TR>



    <TR ALIGN=CENTER>
    <TD COLSPAN=3><INPUT TYPE="BUTTON" VALUE="Calculate" 
    NAME="CalcButton"
    OnClick="gpacalc()"></TD>
    </TR>
    </TABLE>
    </FORM>
    <BR>
    <P>

    <P>
    </CENTER>

    <BR>

<script type="text/javascript">

function gpacalc()
{
//define valid grades and their values
var gr = new Array(5); 
var cr = new Array(5);
var ingr = new Array(3);


// define valid grades and their values


var grcount = 5; 
gr[0] = "A";
cr[0] = 4;
gr[1] = "B";
cr[1] = 3;
gr[2] = "C";
cr[2] = 2;
gr[3] = "D";
cr[3] = 1;
gr[4] = "F";
cr[4] = 0;



// retrieve user input
ingr[0] = document.GPACalcForm.GR1.value;
ingr[1] = document.GPACalcForm.GR2.value;
ingr[2] = document.GPACalcForm.GR3.value;
ingr[3] = document.GPACalcForm.GR4.value;

// Calculate GPA
var allgr =0;
var gpa = 0;


for (var x = 0; x < 4; x++)
        {
        if (ingr[x] == "") break;  // if empty value then stop
        var validgrcheck = 0;
        for (var xx = 0; xx < grcount; xx++)
                {
                if (ingr[x] == gr[xx])
                        {
                        allgr = allgr + (parseInt(ingr[x],10)); 

                        validgrcheck = 1;
                        break;
                        }
                }
        if (validgrcheck == 0)
                {
                alert("Error- Please use standard college grades in the form of A B C D F.");
                return 0;
                }
        }

gpa = allgr;

if(eval(gpa) >=3.50) {

alert("CONGRATULATION! your GPA =  " + eval(gpa)); 

return 0;
    }
    else {
        alert("Thanks for try your GPA =  " + eval(gpa));
        return 0;
    }
}


</SCRIPT>


</div>

    <div class="footer">

    </div>
</body>
</html>

Answer 1

Your problem is in this line (parseInt(ingr[x],10)) . Here you are trying to parse a character ('A','B',etc) as an integer and the result is NaN . Instead try

allgr = allgr + (cr[x],10);

to calculate the GPA.

BTW, I don't see the logic to calculate the average.

Javascript User input Average GPA calculator

Question

1 answers

solution1
1 ACCPTED

Javascript User input Average GPA calculator

Question

1 answers

solution1 1 ACCPTED

solution1
1 ACCPTED