Nsryjdtyk

im trying to build a modal, with a try-catch block, so if everyting is valid and entered correctly in the form, the modal should be closed

This is the function login, i wonder why $('#dialog').modal('hide'); does not work

  <script>

        function login() {



            var kontakt = new Kontakt();

            kontakt.name = document.getElementById('name').value;

            kontakt.email = document.getElementById('email').value;

            kontakt.plz = document.getElementById('plz').value;

            kontakt.ort = document.getElementById('ort').value;

            kontakt.strasse = document.getElementById('strasse').value;









try {

    kontakt.pruefe();  

}

catch(err) {

    return window.alert(err.message);   

} 



kontakteSpeicher.neuerKontakt(kontakt);}

$('#dialog').modal('hide');

    </script>







    </head>

This is the modal

 <div class="container">

                <h2></h2>

                <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#dialog">

                    Login-Dialog öffnen

                </button>



                <!-- The Modal -->

                <div class="modal" id="dialog">

                    <div class="modal-dialog">

                        <div class="modal-content">

                            <div class="modal-header">

                                <h4 class="modal-title">Login (im header)</h4>

                                <button type="button" class="close" data-dismiss="modal">&times;</button>

                            </div>



                            <div class="modal-body">

                                <div class="container">

                                    <p>im body:</p>

                                    <form>

                                        <div class="form-group row">

                                                    <label for="name" class="col-sm-2 col-form-label">Name</label>

                                                    <div class="col-sm-10">

                                                        <input type="text" class="form-control" placeholder="Name" id="name">

                                                    </div>

                                        </div>

                                        <div class="form-group row">

                                            <label for="email" class="col-sm-2 col-form-label">E-Mail</label>

                                            <div class="col-sm-10">

                                                <input type="email" class="form-control" placeholder="E-Mail" id="email">

                                            </div>

                                        </div>

                                        <div class="form-group row">

                                            <label for="plz" class="col-sm-2 col-form-label">PLZ</label>

                                            <div class="col-sm-10">

                                                <input type="number" class="form-control" placeholder="PLZ" id="plz">

                                            </div>

                                        </div>

                                        <div class="form-group row">

                                                <label for="ort" class="col-sm-2 col-form-label">Ort</label>

                                                <div class="col-sm-10">

                                                    <input type="text" class="form-control" id="ort" placeholder="Ort">

                                                </div>

                                            </div>

                                        <div class="form-group row">

                                            <label for="strasse" class="col-sm-2 col-form-label">Strasse und Hausnummer</label>

                                            <div class="col-sm-10">

                                                <input type="text" class="form-control" id="strasse" placeholder="Strasse und Hausnummer">

                                            </div>

                                        </div>

                                    </form>

                                </div>

                            </div>



                            <div class="modal-footer">

                                <button type="button" class="btn btn-primary btn-block" onclick="login()">Speichern</button>

                            </div>

                        </div>

                    </div>

                </div>



            </div>

The only problem you have is that the $("#dialog").modal('hide') statement isn't inside your login function body.
This should work.

function login() {



        var kontakt = new Kontakt();

        kontakt.name = document.getElementById('name').value;

        kontakt.email = document.getElementById('email').value;

        kontakt.plz = document.getElementById('plz').value;

        kontakt.ort = document.getElementById('ort').value;

        kontakt.strasse = document.getElementById('strasse').value;









try {

    kontakt.pruefe();  

}

 catch(err) {

    return window.alert(err.message);   

} 



kontakteSpeicher.neuerKontakt(kontakt);

$('#dialog').modal('hide');

}

It seems like you are closing your login function on the line before the call to close the modal.
Try to change this:

kontakteSpeicher.neuerKontakt(kontakt);}

$('#dialog').modal('hide');

to this:

kontakteSpeicher.neuerKontakt(kontakt);

$('#dialog').modal('hide'); }