3

Já tentei de várias formas desabilitar o botão submit de um form que está dentro de uma janela bootstrap modal, só que não obtive sucesso. Já pesquisei na documentação mas tb não encontrei. Alguém pode me dar uma luz ?

Vejam algumas das formas que tentei fazer:

$('#cxEditaEvento').find('button').prop('disable',true);

$('#cxEditaEvento button:contains('Salvar')').prop('disable',true);

A caixa modal que uso está definida assim (coloquei só alguns campos pro código não ficar muito extenso):

<div class="modal fade" id="cxEditaEvento" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title text-left" id="myModalLabel">Dados do Evento</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" role="formEditaEvento" id="formEditaEvento" name="formEditaEvento" method="POST" action="saveEvento.php">
                    <fieldset>
                    <div class="form-group">
                        <label class="col-sm-3 control-label" for="showID">ID</label>
                        <div class="col-sm-6">
                            <input class="form-control" type="text" name="showID" id="showID" disabled />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label" for="complemento">Descrição</label>
                        <div class="col-sm-6">
                            <input class="form-control" type="text" name="complemento" id="complemento" placeholder="Complemento sobre o evento" value="" />
                        </div>
                    </div>
                    <div class="form-actions">
                        <button type="submit" name="enviar" value="enviar" class="btn btn-primary btn-large pull-left">Salvar</button>
                    </div>
                    </fieldset>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
            </div>
        </div>
    </div>
</div>
3
  • Desabilitar é impedir que o formulário seja submitido?
    – Miguel
    25/05/2016 às 19:51
  • 2
    A sintaxe está errada, esta faltando um aspa simples no seletor. $('#cxEditaEvento) para $('#cxEditaEvento'). Ve se resolve
    – Euler01
    25/05/2016 às 19:59
  • Então Diego...errei na hora de digitar, mas no meu código já tem a aspa simples. Valeu!
    – Francisco
    25/05/2016 às 20:28

2 Respostas 2

1

Olá ao invés de usar a propriedade 'disable' na verdade deve se usar 'disabled' com d ao final.

Use assim e selecionará o botão certo e o desabilitará.

$('button:contains("Salvar")').prop('disabled',true);

Lembrando que $('#cxEditaEvento').find('button').prop('disabled',true); desabilitará todos os botões e não apenas o botão que contém "Salvar"

Veja um exemplo de como fica em https://jsfiddle.net/7v06n73o/1/

1
  • Caramba! Que vacilo meu! Agora deu certo. Obrigado pessoal !
    – Francisco
    25/05/2016 às 20:49
1

O problema é o nome da propriedade disabled.

ao invés de

$('#cxEditaEvento').find('button').prop('disable',true);

$('#cxEditaEvento button:contains('Salvar')').prop('disable',true);

tenta:

$('#cxEditaEvento').find('button').prop('disabled',true);
                                                ^

$('#cxEditaEvento button:contains('Salvar')').prop('disabled',true);
                                                           ^
1
  • Obrigado Sergio. Deu certinho.
    – Francisco
    25/05/2016 às 20:52

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .