How to disable too many buttons in a foreach when clicking a single button?

0

I have a grid with a list of cleanups to do. Initially all buttons are green with the text "Start Cleaning". When I start cleaning, this button changes to blue and the text changes to "Continue Cleaning".

Perfect, this is already working. I would like, as long as there was an open cleaning, that the other buttons would be disabled, and would be enabled again only after the open cleaning has been completed.

The idea is not to allow the user to start cleaning without finishing the one that is open. Here is the snippet of my code that is inside a foreach:

<tr style="background-color:<?php echo $corFundoSujoAgendado?>;color: <?php echo $corQuartoSujoAgendado; ?>">
    <td><center><?php echo $quartos["quarto"];  ?></center></td>
    <td><center><?php echo date("d/m/Y H:i",strtotime($quartos["solicitado_em"]));  ?></center></td>
    <td>
    <center>
        <?php if (count($limpezaEmAbertoPorIDLimpeza) > 0)  {?>
        <a  class='ui button fluid blue iniciarLimpeza' href="javascript:exibirLimpezaParaIniciar(<?php echo $idLimpezaQuartoSujoAgendado;  ?>);" ><span class="iniciar">Continuar limpeza</span>
                            &nbsp;&nbsp
                    </a>                                                                                            
        <?php } else { ?>
        <a  class='ui button fluid green iniciarLimpeza' href="javascript:exibirLimpezaParaIniciar(<?php echo $idLimpezaQuartoSujoAgendado;  ?>);" ><span class="iniciar">Iniciar Limpeza</span>
                            &nbsp;&nbsp
                    </a>
        <?php } ?>
    </center>                                                                            

    </td>

    
asked by anonymous 21.09.2018 / 13:43

2 answers

0

You can listen to changes with change: link With this use jQuery to change the property

  

$ ("input"). prop ('disabled', true)

    
21.09.2018 / 13:50
0

Good morning everyone! Thank you for your help. I've got a simpler solution that I share with you below:

<script>    
    $(document).ready(function () 
    {        
            if ($(".continuarLimpeza").length == 0) 
            {
                $(".iniciarLimpeza").removeClass("disabled")
            } 
            else 
            {
                    $(".iniciarLimpeza").addClass("disabled")
                    $(".continuarLimpeza").removeClass("disabled")
            }
            return; 
    });
</script>
    
26.09.2018 / 13:09