Javascript Won't run correctly

Question

Been trying to get this code work but I can't seem to get the javascript correct.

function annualSalRA() {
    var rateRA = document.getElementById('hourlywageRA').value;
    var parsedRateRA = parseFloat(rateRA);
    var hoursRA = document.getElementById('hoursworkedRA').value;
    var parseHoursRA = parseFloat(hoursRA);
    var resultRA = (parsedRateRA * parseHoursRA * 52.0);
    if (rateRA != "" || (hoursRA != "")) {
        if (resultRA < "20000") {
            getElementById("answerRA").innerHTML = "The salary is too little."
        };
        else if (resultRA < "25000") {
            getElementById("answerRA").innerHTML = "The salary is almost enough. Let's negotiate."
        };
        else(resultRA >= "25000") {
            getElementById("answerRA").innerHTML = "The salary is a great salary from me."
        };
        document.getElementById('outcomeRA').innerHTML = resultRA;
    };
    else(document.getElementById('outcomeRA').innerHTML = "Cannot Leave Fields Blank!");
};

<h6>Hourly Wage:</h6>
<input type="text" id="hourlywageRA" />
<h6>Hours Per Week:</h6>
<input type="text" id="hoursworkedRA" />
<h6><h6>
<button onclick="annualSalRA()">Calculate</button>
<p>The Annual Rate is:</p>
<p id="outcomeRA"></p><p id="answerRA"></p>

I'm probably making a silly mistake but I cannot figure it out.

Thanks

You need to use **document**.getElementById – user2182349 Oct 16 '15 at 02:26 — user2182349, Oct 16 '15 at 02:26

score 0 · Answer 1 · edited May 23 '17 at 12:03

Ok. I think I got it working for your. Here is functional code (I think).

<h6>Hourly Wage:</h6>
<input type="text" id="hourlywageRA" />
<h6>Hours Per Week:</h6>
<input type="text" id="hoursworkedRA" />
<h6><h6>
<button id="button">Calculate</button>
<p>The Annual Rate is:</p>
<p id="outcomeRA"></p><p id="answerRA"></p> 


var el = document.getElementById("button");
el.addEventListener("click", function (){

 var rateRA = document.getElementById('hourlywageRA').value;
var parsedRateRA = parseFloat(rateRA);
var hoursRA = document.getElementById('hoursworkedRA').value;
var parseHoursRA = parseFloat(hoursRA);
var resultRA = (parsedRateRA * parseHoursRA * 52.0);
if (rateRA != "" || hoursRA != "") {
    if (resultRA < "20000") {
        document.getElementById("answerRA").innerHTML = "The salary is too little."
    }
    else if (resultRA < "25000") {
        document.getElementById("answerRA").innerHTML = "The salary is almost enough. Let's negotiate."
    }
    else if (resultRA >= "25000") {
        document.getElementById("answerRA").innerHTML = "The salary is a great salary from me."
    }
    document.getElementById('outcomeRA').innerHTML = resultRA;
}
else { 
    document.getElementById('outcomeRA').innerHTML = "Cannot Leave Fields Blank!"
}
});

and a JSFIddle:

https://jsfiddle.net/chrislewispac/q3a0dL20/

How did I fix it?

I looked at the console.log and could see that you had a number of syntax errors.

a. it is document.getElementById http://www.w3schools.com/jsref/met_document_getelementbyid.asp

b. if{} statements do not get line ending ; and were formatted incorrectly http://www.w3schools.com/js/js_if_else.asp

c. You were using an onclick event which was not registering your function so I was getting in console that your function was not defined. I replaced your onclick with an event listener.

Uncaught ReferenceError: function is not defined with onclick

Javascript Won't run correctly

1 Answers1