Bloqueio de Campos e Botões em Formulários

jQueryJSScript
O código fornecido ilustra como bloquear ou desativar campos e botões em formularios usando jQuery. Ele define a propriedade readonly para campos de texto, desativa seleções, checkboxes, radios e botões em um formulário, impedindo que os usuários interajam com eles.

Como instalar

  1. Certifique-se de que a biblioteca jQuery está incluída em seu projeto.
  2. Copie e cole o código fornecido em um arquivo JavaScript ou entre as tags <script> e </script> em seu documento HTML.
  3. Substitua #id_do_item pelo ID do elemento que deseja bloquear, ou adicione IDs adicionais separados por vírgula dentro das aspas.
  4. Para o código do repeater JetFormBuilder, apenas copie e cole o código fornecido em seu arquivo JavaScript ou HTML conforme necessário.

Explicando o código

  • No primeiro bloco de código:
    1. var block = '#id_do_item'; declara uma variável block e atribui o ID do elemento que deseja bloquear.
    2. jQuery(block).prop('readonly', true); define a propriedade readonly do elemento para true, tornando-o somente leitura.
    3. jQuery(block).attr('tabindex', '-1'); define o atributo tabindex para -1, impedindo a navegação para este elemento com a tecla tab.
  • No segundo bloco de código:
    1. jQuery(block).attr('disabled',true); desativa o elemento selecionado.
    2. jQuery("input[type='checkbox']").prop("disabled", true); desativa todos os checkboxes.
    3. jQuery("input[type='radio']").prop("disabled", true); desativa todos os botões de rádio.
  • No terceiro bloco de código:
    1. $('.jet-form-builder-repeater__remove').prop('disabled', true) desativa o botão de remover em um repeater do JetFormBuilder.
    2. $('.jet-form-builder-repeater__new').prop('disabled', true) desativa o botão de adicionar novo item em um repeater do JetFormBuilder.
    3. $("input").prop('disabled', true) desativa todos os campos de input.

Códigos

JS

				
					
				
			
				
					// Para bloquear campos de texto, seleção, checkboxes e radios


   var block = '#lab1_id_do_item';
   
   jQuery( document ).ready(function() {
      jQuery(block).prop('readonly', true);
      jQuery(block).attr('tabindex', '-1');
      jQuery(block).attr('disabled',true);
      jQuery("input[type='checkbox']").prop("disabled", true);
      jQuery("input[type='radio']").prop("disabled", true);
   }); 


// Para travar botões de um repeater JetFormBuilder

   jQuery('.jet-form-builder-repeater__remove').prop('disabled', true);
   jQuery('.jet-form-builder-repeater__new').prop('disabled', true);
   jQuery("input").prop('disabled', true);


				
			

Relacionados

teste

teste
Script

Desabilitar Ferramentas de Desenvolvedor no Navegador

Este código JavaScript desabilita automaticamente as ferramentas de...
JSScript

Transições Suaves de Rolagem

O código é utilizado para implementar a biblioteca...
JSScript

Fale com a Lab1