Confirmation dialog using angular

Question

Confirmation dialog using angular

Navigation

#1 by (1 votes)

4

How do I instead call this default browser alert (of addition confirmation) call a screen defined by me? or manipulate this alert and be able to apply css.

$http.post("http://localhost:8080/rest/tarefas", $scope.tarefa)
    .success(function(data, status, headers, config) {
        alert('Tarefa Adicionada com sucesso');
        $scope.buscaTarefa();
    }).error(function(data, status, headers, config) {
        alert('error');
    });
    $scope.buscaTarefa();
    $route.reload();

javascript angularjs

asked by anonymous 25.07.2017 / 18:05

1 answer

Can a list of a type not be a list of its 'top' type? Web Scraping Selenium + Python in site with dynamic generation via JS = difficulty to map elements

score 1 · Accepted Answer

To open a modal, place this line $('#idModal').modal('show')l in the places of the alerts, setting one id to success and another one to error.

Create two modes, one for success and one for error, with their ids set above.

Bootstrap Modal

Library

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

Your Script

$http.post("http://localhost:8080/rest/tarefas", $scope.tarefa)
.success(function(data, status, headers, config) {
    $(document).ready(function(){
        $("#myModalSucess").modal('show');
    });
    $scope.buscaTarefa();
}).error(function(data, status, headers, config) {
    $(document).ready(function(){
        $("#myModalError").modal('show');
    });
});
$scope.buscaTarefa();
$route.reload();

HTML

<!-- Modal HTML Erro -->
<div id="myModalError" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Erro</h4>
            </div>
            <div class="modal-body">
                <p>Erro campo de preenchimento obrigatorio  </p>
                <p class="text-warning"><small>Erro Erro Erro Erro Erro Erro </small></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

 <!-- Modal HTML Sucesso -->
<div id="myModalSucess" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Sucesso </h4>
            </div>
            <div class="modal-body">
                <p>Tarefa Adicionada com sucesso. </p>
                <p class="text-warning"><small>Sucesso Sucesso Sucesso Sucesso Sucesso Sucesso .</small></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>