Problem with if else

Question

Problem with if else

Navigation

#1 by (6 votes)
#2 by (1 votes)

2

When executing the code the result always prints the statement of else , even if the condition of if true.

function Calculate()
{
    var planetsList = {
        "Mercurio": 0,
        "Venus": 0,
        "Tierra": 1,
        "Marte": 2,
        "Júpiter": 16,
        "Saturno": 17,
        "Urano": 14,
        "Neptuno": 2,
        "Plutón": 1
    }

    var num = document.form.elements["number"].value;
    var res = "";

    for(var planet in planetsList) {
        if(num <= planetsList[planet]) {
            res += planet + ": " + planetsList[planet] + "<br/>";
        }
        else {
            res = "No hay planetas que contengan una cantidad de satélites igual o mayor a la especificada.";
        }
    }

    document.getElementById("result").innerHTML = res;
}

<!DOCTYPE html>

<html>
    <head>
        <meta charset="utf-8">
        <title>Objetos</title>
    </head>
    <body>
        <div>
            <form name="form" method="post">
                <table>
                    <tr>
                        <th>Ingrese el número de satélites:</th>
                        <td><input type="text" size="2" name="number" /></td>
                    </tr>
                    <tr>
                        <td colspan="2"><input type="button" value="Calcular" onclick="Calculate()"/></td> 
                    </tr>
                </table>
            </form>
        </div>
        <div id="result"></div>
    </body>
</html>

javascript

asked by Neon 03.04.2018 в 16:45

source

2 answers

1

There is a small problem in the logic when the html string to be presented is put together.

The planets are indeed being listed, but as the loop goes through the whole arrangement, at some point it crosses a planet that does not comply and in that line of code all the content of the string is replaced. The result is that at the end of the loop only the message is shown that there are no planets that meet the condition, except in the case that the last one of the arrangement did.

the solution is to condition the loop, if previously there were no planets, it is written, otherwise it is omitted.

function Calculate()
{
var planetsList = {
    "Mercurio": 0,
    "Venus": 0,
    "Tierra": 1,
    "Marte": 2,
    "Júpiter": 16,
    "Saturno": 17,
    "Urano": 14,
    "Neptuno": 2,
    "Plutón": 1
}

var num = document.form.elements["number"].value;
var res = "";
var cumplen = 0;

for(var planet in planetsList) {
    if(num <= planetsList[planet]) {
        res += planet + ": " + planetsList[planet] + "<br/>";
        cumplen++;
    }
}
if(cumplen == 0) { res += "No hay planetas que contengan una cantidad de satélites igual o mayor a la especificada.";}

document.getElementById("result").innerHTML = res;
}

answered by 03.04.2018 в 17:06

Show current date in input type date with JavaScript How to convert a ComboBox from String to Int?

score 6 · Accepted Answer

I think your condition is wrong. As I observe it is true for some elements of your array but you overwrite the final answer when a single element does not meet the condition.

You should move your validation out of for and only indicate the message "no planets ..." if the answer is still empty at the end of your for

function Calculate()
{
    var planetsList = {
        "Mercurio": 0,
        "Venus": 0,
        "Tierra": 1,
        "Marte": 2,
        "Júpiter": 16,
        "Saturno": 17,
        "Urano": 14,
        "Neptuno": 2,
        "Plutón": 1
    }

    var num = document.form.elements["number"].value;
    var res = "";

    for(var planet in planetsList) {
        
        if(num <= planetsList[planet]) {
            res += planet + ": " + planetsList[planet] + "<br/>";
        }
    }
    
     if(res == "") {
            res = "No hay planetas que contengan una cantidad de satélites igual o mayor a la especificada.";
        }

    document.getElementById("result").innerHTML = res;
}

<!DOCTYPE html>

<html>
    <head>
        <meta charset="utf-8">
        <title>Objetos</title>
    </head>
    <body>
        <div>
            <form name="form" method="post">
                <table>
                    <tr>
                        <th>Ingrese el número de satélites:</th>
                        <td><input type="text" size="2" name="number" /></td>
                    </tr>
                    <tr>
                        <td colspan="2"><input type="button" value="Calcular" onclick="Calculate()"/></td> 
                    </tr>
                </table>
            </form>
        </div>
        <div id="result"></div>
    </body>
</html>