Problem with the notify plugin

Asked

Viewed 134 times

0

I’m having a little trouble viewing the plugin notification when the form runs. The form itself is perfect. What I understand is that when it will appear not from time and the notification closes even before opening. Thank you so much for your help. https://notifyjs.jpillora.com (Notification plugin)

FORM

 <form method="post" name="formCadastro" id="formCadastro" action="<?php $PHP_SELF; ?>" onsubmit="return confirmacao();">.....</form>

Javascript

 function confirmacao() {
   $.notify("Hello World");
return true;    
}
javascript jquery

  • You want the notification to appear before you submit the form?

  • after sending the form.

  • I know. But after you send the form the page is reloaded or is using Ajax?

  • Thank you for helping. the page is reloaded.

  • So. When you submit a form, the page is immediately reloaded, there is no time to see anything... what you should do is show the message AFTER the page is reloaded informing the user that everything worked out, IE, the form was duly received.

  • perfect. have any idea to get this?

  • Yes. After sending the page will be reloaded. Inside the block in the PHP code where everything "worked out", you can call the function that shows the notification.

  • Do not need this onsubmit... you will call the function only if everything went right after sending and reloading the page.

Show 3 more comments

2 answers

1


The problem is that when you submit the form, the page is immediately redirected to the destination indicated on action. Thereby, no time show no message on the screen (even if you try to show, the user will not be able to see).

What you should do is notify after sending when the page is loaded (or reload if the destination is the page itself).

The structure would be this:

<?php
// recebo o formulário
// abro a validação do formulário (um if)
   // se deu tudo certo, chamo o plugin
?>
<script>
$(document).ready(function(){
    $.notify("Formulário enviado com sucesso!");
});
</script>
<?php
// fecho a validação do formulário (fecha o if)
?>

You can also show an error notification if there has been a problem validating the form. Just do a else and call the script likewise.

  • Pow dude. Very enlightening. Thank you very much. It worked!

-1

Look guys, I made some modifications and notify works on Ionic and fires with a certain time.

I step here to share with you.

index file.html

<!DOCTYPE html>
<html ng-app="app">
    <head>
        <title>Angular Notify Demo</title>

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <link href="angular-notify.css" rel="stylesheet">
        <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
    </head>
    <body ng-controller="DemoCtrl">

        <div>

            <div class="container">

                <div class="row">
                    <div class="col-md-12">
                        <h2>angular-notify</h2>
                        <p class="lead">Notify - angular - ionic.</p>
                    </div>
                </div>

            <ion-content>
                <br>
                Hora: {{currentTime}}
                <br>
            </ion-content>


        </div>

       <script src="angular.js"></script>
       <script src="angular-notify.js"></script>
       <script src="demo.js"></script>
    </body>
</html>

demo js.

angular.module('app', ['cgNotify']);

    angular.module('app').controller('DemoCtrl',function($interval,$scope,notify,dateFilter) {
        $scope.currentTime = dateFilter(new Date(), 'hh:mm');

        $scope.updateTime = $interval(function() {

            $scope.currentTime = dateFilter(new Date(), 'hh:mm');
            $scope.horaAtual = dateFilter(new Date(), 'hh');
            $scope.minutosAtual = dateFilter(new Date(), 'mm');
            $scope.SegundosAtual = dateFilter(new Date(), 'ss');



            if($scope.minutosAtual == 46 && $scope.SegundosAtual == 0) {

                function demoMessageTemplate() {

                    var messageTemplate = '<span>Agora tudo deu certo!</span> ';

                    notify({
                        messageTemplate: messageTemplate,
                        classes: $scope.classes,
                        scope:$scope,
                        templateUrl: $scope.template,
                        position: $scope.position,
                    });       

                };  // fim demoMessageTemplate

                window.load = demoMessageTemplate();

            } // fim if

        }, 1000); // fim do relogio

    });

Here’s the whole project

https://github.com/fredtavares2018/notify---angular---ionic

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.