Cannot call toFixed on a number variable

Question

I am receiving the follow error in my Console : " Uncaught TypeError: undefined is not a function "

<script>
    //name : calculateResult()-->

    function calculateResult() {
        console.log("calculateResult() function called!");

        //1. Declare Variables-->
        var hoursWorked,
            jobCategory,
            jobCategorySelectedIndex,
            hoursEligibleForBasePay,
            hoursEligibleForOvertime,
            basePayAmount,
            overtimePayAmount,
            totalPayAmount,
            overtimePayRate;

        //2. Values for Local Variables-->
        hoursWorked = document.getElementById("txthoursWorked").value;
        console.log("hoursWorked = " + hoursWorked);

        //Get Select element choice: Job Category-->

        jobCategorySelectedIndex = document.getElementById("seljobCategory").selectedIndex;
        console.log("jobCategorySelectedIndex = " + jobCategorySelectedIndex);

        jobCategory = document.getElementById("seljobCategory").options[jobCategorySelectedIndex].value;
        console.log("jobCategory = " + jobCategory);

        //3. Do Calculations-->
        hoursWorked = parseFloat(hoursWorked);

        if (jobCategory == "M") {
            basePayRate = "25";
        } else if (jobCategory == "R") {
            basePayRate = "20";
        } else if (jobCategory == "S") {
            basePayRate = "15";
        }

        hoursEligibleForBasePay = 40;
        basePayAmount = basePayRate * hoursEligibleForBasePay;
        console.log("basePayAmount = " + basePayAmount);
        console.log("hoursEligibleForOvertime =" + hoursEligibleForBasePay);

        if (hoursWorked > 40) {
            hoursEligibleForOvertime = hoursWorked - 40;
        } else {
            hoursEligibleForOvertime = 0;
        }
        console.log("hoursEligibleForOvertime = " + hoursEligibleForOvertime);


        overtimePayRate = 1.5 * basePayRate;
        overtimePayAmount = overtimePayRate * hoursEligibleForOvertime;
        totalPayAmount = basePayRate + overtimePayAmount;

        console.log("overtimePayRate = " + overtimePayRate);
        console.log("overtimePayAmount = " + overtimePayAmount);
        console.log("totalPayAmount = " + totalPayAmount);

        //4. Display Results-->
        displayString = "Base Pay " + "$" + basePayAmount.toFixed(2) + "<br />" +
            "Overtime Pay &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" + "$" + overtimePayAmount.toFixed(2) + "<br />"
        "Total Pay &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" + "$" + totalPayAmount.toFixed(2);

        document.getElementById("divDisplay").innerHTML = displayString;



    }
</script>

the error is in the display string on the Total PayAmount line

any ideas?

Answer 1

The actual error is not actually on that line.

totalPayAmount is defined here:

totalPayAmount = basePayRate + overtimePayAmount;

basePayRate is defined here:

if (jobCategory == "M") {
    basePayRate = "25";
} else if (jobCategory == "R") {
    basePayRate = "20";
} else if (jobCategory == "S") {
    basePayRate = "15";
}

So basePayRate is a string. Then totalPayAmount is also a string, which would not have a toFixed method.