Connect javascript and HTML

Question

I'm beginning to learn JavaScript , and browser API. Why, if I press the "save" button , the pop up window does not appears in the browser ? Where am I wrong?

<label for="txtNome"><input id="txtNome" type="text" value=""/><br/></label>
<label for="txtCognome"><input id="txtCognome" type="text" value=""/><br/></label>
<button id="btnSalva"/>Salva</button><br/>

<script>
    var model = { nome: "Mario", cognome: "Rossi" };

    var view = {
        txtNome: document.getElementById("txtNome"),
        txtCognome: document.getElementById("txtCognome"),
        btnSalva: document.getElementById("btnSalva")
    };

    var controller;
        controller = {

        init: function () {
            view.txtNome.value = model.nome;
            view.txtCognome.value = model.cognome;
            view.btnSalva.onclick = controller.salva;
        },

        salva: function () {
            model.nome = view.txtNome.value;
            model.cognome = view.txtCognome.value;
            window.alert("FATTO");
        }
    };
</script>

Answer 1

You need to call controller.init() , otherwise your code does nothing, you were just declaring some objects.

 var model = { nome: "Mario", cognome: "Rossi" }; var view = { txtNome: document.getElementById("txtNome"), txtCognome: document.getElementById("txtCognome"), btnSalva: document.getElementById("btnSalva") }; var controller; controller = { init: function () { view.txtNome.value = model.nome; view.txtCognome.value = model.cognome; view.btnSalva.onclick = controller.salva; }, salva: function () { model.nome = view.txtNome.value; model.cognome = view.txtCognome.value; window.alert("FATTO"); } }; controller.init(); //call init! 

 <label for="txtNome"><input id="txtNome" type="text" value=""/><br/></label> <label for="txtCognome"><input id="txtCognome" type="text" value=""/><br/></label> <button id="btnSalva"/>Salva</button><br/>