Question 228231 in Html Question posted in
Some basic documentation can be found here.

Html – Trouble getting if else statement to work… Only the first if statement is logging

I’m a bit of a beginner to this so I’m sure the solution is something simple but essentially I’m trying to build a calculator tool. Depending on what the user selects for Occupancy Type, I need the occTypeNum to be a different number. For example, if mercantile is selected, occTypeNum should be 45.

Below is my function with the if else statement.

let occTypeNum = '';

function CalcOcc() {
        let occLoad=document.getElementById("occload").value;
        let occType=document.getElementById("occtype").value;

        if (occType = "residential") {
            occTypeNum = 25;
        } else if (occType = "business") {
            occTypeNum = 30;
        } else if (occType = "mercantile") {
            occTypeNum = 45;
        } else if (occType = "assembly") {
            occTypeNum = 60;
        } 
        
        console.log(occLoad + '_' + occType + '_' + occTypeNum);
}

// HTML

<td>Occupancy Type</td>
                            <td>
                                <select id="occtype" name="occtype">
                                    <option value="residential">Residential</option>
                                    <option value="business">Business</option>
                                    <option value="mercantile">Mercantile</option>
                                    <option value="assembly">Assembly</option>
                                </select> 
                            </td>

This is how the app is behaving.

(https://phpout.com/wp-content/uploads/2023/08/wJuSv.gif)

I tried adding the occLoad and occType variables into the global scope. I tried removing the "else" and making 4 different if statements. I also tried to update the option values to represent the numbers I need for each option but it appears those have to be a string. Lastly, I removed the "occType =" from each statement Example…

if ("residential") { occTypeNum = 25; }

This fixed the occType in my console.log but the occTypeNum was still 25 for every option.

Not sure what else to try… I’ve looked at several other examples online and don’t see what I’m doing wrong.

Tags:

2

Answers


  1. 0

    To compare in your If statement, use occType === "residential" (= three times) instead of occType = "residential", the later makes you assign "residential" to occType and not compare its value

    Login or Signup to reply.
  2. 0

    The single equal (=) to is an assignment operator its not used for comparison you should use either the double equal to(==) which neglects the data type or triple equal to (===) that compares both the value and the data type
    your code should look more like this

        if (occType == "residential") {
        occTypeNum = 25;
    } else if (occType == "business") {
        occTypeNum = 30;
    } else if (occType == "mercantile") {
        occTypeNum = 45;
    } else if (occType == "assembly") {
        occTypeNum = 60;
    }

    or you can also consider using the switch
    switch (occType){
    case ‘residential’:
    occTypeNum = 25;
    break;
    case ‘business’:
    occTypeNum = 30;
    break;
    case ‘mercantile’:
    occTypeNum = 45;
    break;
    case ‘assembly’:
    occTypeNum = 60;
    break;
    default:
    alert(‘select an option’)
    break;
    😊

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search