Question

I’m trying to hide a div when a submit is done from a form. The changes happen but when the alert(“link”) ends, it all goes back to how it was.

JavaScript:

<script type="text/javascript" language="javascript">
    function checarLogin(user, pass){
        var e;
        if (user.value == "a") {
            if (pass.value == "b") {
                alert("Bienvenido.");
                e = document.getElementById('login').style.display='none';
                alert("link");
            } else
            alert("Usuario o clave incorrectos.");
        } else
            alert("Usuario o clave incorrectos.");

    }
</script>

HTML:

<div id="login">
    <form onsubmit="checarLogin(user, pass)">
    Ingrese usuario y clave para ver los documentos.
    <div id="inlogin" display="none">
        <br><br>
        Usuario <input name="user" type="text"><br><br>
        Clave <input name="pass" id="clave" type="password"><br>
        <input type="submit">
    </div>
    </form>
</div>

<div id="descargas">
    Descargables.
    <div id="indescargas">
    </div>
</div>

I want to hide the login DIV.

Answer 1

When you submit a form it does a round trip to the server. Most likely the page is refreshing and this causes the content to go back to the way it was. You could test this by making your page tall, scroll down and submit. If you bounce back to the top then the page has refreshed.

To work around this you would want to submit the form data using an ajax request instead.