How to disable button after sending message?

Question

How to disable button after sending message?

Navigation

#1 by (3 votes)
#2 by (0 votes)

3

I have an app on Ionic that sends messages. I have already helped, here in the forum, to make a way that does not allow the user to touch the button send, without typing anything, so the message does not go blank. Blz, it works cool

<button class="button button-clear button-positive" ng-disabled="msgForm.msg.$invalid && disableButton" ng-click="enviarMsg(mensagem)">Enviar</button>

controller:

$scope.enviarMsg = function (mensagem) {
    $scope.disableButton = true;

    var dia = moment().format(); //2016-02-16 T 16:05:52-02:00
    var diaP = dia.split('T');
    var dia = diaP[0];

    var horaP = diaP[1];
    var horaP2 = horaP.split(':');
    var hora = horaP2[0]+':'+horaP2[1];

    var enviaMsg = {
        mensagem: mensagem,
        idUsuario: $window.localStorage.getItem('idUsuario'),
        idCep: $window.localStorage.getItem('idCep'),
        nome: $window.localStorage.getItem('nome'),
        dia: dia,
        hora: hora
    }
    $http.post("http://www.vigilantescomunitarios.com/www/php/enviaMsgLogra.php", enviaMsg).success(function (data){
        $scope.disableButton = false;
        pegaMsgsLogra();
        $scope.mensagem = {
          msg: ""
        }

    });
}

However, since the message sometimes times out, I would like the button also disabled, and the field, too, until the message is sent. How could I do that? because I'm already using ng-disabled on the button.

angularjs ionic

asked by anonymous 10.05.2016 / 21:52

2 answers

0

Do the following: In the form tag, enter the following code:

 onsubmit="this.enviar.value = 'Enviando...'; this.enviar.disabled = true;"

Then, on the submit button, enter the following code:

name="enviar" id="enviar-contato"

It will look for the button with the name, after the submit, it will disable, and see no more being clicked until the sending is done.

10.05.2016 / 22:34

Convert date and time to numeric value in JavaScript Execute builder of an Attribute

score 3 · Accepted Answer

You can try this:

//Controller

$scope.disableButton = false;

function myController(){
$scope.disableButton = true;
//Requisição
....
//Após o fim da requisição disableButton volta a ser false
$scope.disableButton = false;
}

Html:

<input type="text" ng-disabled="disableButton"/>
<button class="button button-clear button-positive" ng-disabled="msgForm.msg.$invalid || disableButton" ng-click="enviarMsg(mensagem)">Enviar</button>

Example: link