Run one button only once

Question

Run one button only once

Navigation

#1 by (6 votes)
#2 by (1 votes)
#3 by (0 votes)
#4 by (-3 votes)

2

Hello friend, I would like to execute a button only once and that you can not click OK again

            <div class="modal-footer">
                <button type="button" class="btn btn-default" id="btnCancelarPreviewFlashReport" data-dismiss="modal">Cancelar</button>
                <button type="button" class="btn btn-success" id="AgregarPreviewFlashReport" name="AgregarPreviewFlashReport"><span class="fa fa-check"></span> Aceptar</button>
            </div>

html

asked by Chris Alexis 26.09.2018 в 18:47

source

4 answers

Why is the download of an excel file forced? R: change the colors of a DCA

score 6 · Answer 1

It is necessary that you add Javascript in this case use JQuery that when you give click() to the button you need to be disabled, identifying it by ID .

I hope you serve, greetings.

$( "#btnCancelarPreviewFlashReport" ).on( "click", function() {
  $(this).attr('disabled', true);
});

$( "#AgregarPreviewFlashReport" ).on( "click", function() {
  $(this).attr('disabled', true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="modal-footer">
                <button type="button" class="btn btn-default" id="btnCancelarPreviewFlashReport" data-dismiss="modal">Cancelar</button>
                <button type="button" class="btn btn-success" id="AgregarPreviewFlashReport" name="AgregarPreviewFlashReport"><span class="fa fa-check"></span> Aceptar</button>
            </div>

score 1 · Answer 2

It can also be done with pure Javascript, without the need for external libraries.

For example, to disable the accept button:

var btnAceptar=document.getElementById("AgregarPreviewFlashReport");
var disableButton = function() { this.disabled = true; };
btnAceptar.addEventListener('click', disableButton , false);

<div class="modal-footer">
  <button type="button" class="btn btn-default" id="btnCancelarPreviewFlashReport" data-dismiss="modal">Cancelar</button>
  <button type="button" class="btn btn-success" id="AgregarPreviewFlashReport" name="AgregarPreviewFlashReport"><span class="fa fa-check"></span> Aceptar</button>
</div>

If you need to do the same with the Cancelar button, it would be enough to create a reference to the element and assign the listener:

var btnCancelar=document.getElementById("btnCancelarPreviewFlashReport");
btnCancelar.addEventListener('click', disableButton , false);

If there are many elements, all can be selected by a class and assigned the listener within a forEach .

score 0 · Answer 3

0

You could do it with Jquery like this:

$('#AgregarPreviewFlashReport').on('click',function() {
    $(this).prop("disabled",true);
});

answered by 26.09.2018 в 18:51

score -3 · Answer 4

A query where I can put the query in the same file or another, someone could give me an example porfa

<div class="modal fade" id="modalPreviewFlashReport" accesskey="-1" role="dialog" aria-labelledby="myModalLabel">

                <div class="modal-footer">

                    <button type="button" class="btn btn-default" id="btnCancelarPreviewFlashReport" data-dismiss="modal">Cancelar</button>
                    <button type="button" class="btn btn-success" id="AgregarPreviewFlashReport" name="AgregarPreviewFlashReport"><span class="fa fa-check"></span> Aceptar</button>
    </div>
 </div>