Comentários

Adicionar JavaScript personalizado a um formulário

  • Artigo
  • 2 minutos para o fim da leitura

O registro da Etapa do Formulário Avançado contém um campo chamado JavaScript Personalizado que pode ser usado para armazenar o código JavaScript para permitir que você estenda ou modifique a exibição visual ou a função do formulário.

O bloqueio personalizado do JavaScript será adicionado ao topo da página pouco antes do fechamento do elemento de marca do formulário.

Campos de formulário

A ID de entrada HTML de um campo de tabela é definida como o nome lógico do atributo. Selecionar um campo, definir valores ou outra manipulação por parte do cliente é fácil com o jQuery.

$(document).ready(function() {
   $("#address1_stateorprovince").val("Saskatchewan");
});

Importante

Adicionar uma coluna de escolha ao formulário baseado em modelo para ser usado em uma etapa de Formulário Avançado ou básico aparecerá na página do portal como um controle de servidor suspenso. Usar JavaScript personalizado para adicionar valores adicionais ao controle resultará em uma mensagem "Postback inválido ou argumento de retorno de chamada" no envio da página.

Validação adicional do campo do cliente

Às vezes é preciso personalizar a validação dos campos no formulário. O exemplo a seguir demonstra a adição de um validador personalizado. Este exemplo força um usuário a especificar um email somente se outro campo para o método de contato preferencial for definido para Email.

Observação

A validação do campo do cliente não tem suporte em uma subgrade.

if (window.jQuery) {
   (function ($) {
      $(document).ready(function () {
         if (typeof (Page_Validators) == 'undefined') return;
         // Create new validator
         var newValidator = document.createElement('span');
         newValidator.style.display = "none";
         newValidator.id = "emailaddress1Validator";
         newValidator.controltovalidate = "emailaddress1";
         newValidator.errormessage = "<a href='#emailaddress1_label'>Email is a required field.</a>";
         newValidator.validationGroup = ""; // Set this if you have set ValidationGroup on the form
         newValidator.initialvalue = "";
         newValidator.evaluationfunction = function () {
            var contactMethod = $("#preferredcontactmethodcode").val();
            if (contactMethod != 2) return true; // check if contact method is not 'Email'.
            // only require email address if preferred contact method is email.
            var value = $("#emailaddress1").val();
            if (value == null || value == "") {
            return false;
            } else {
               return true;
            }
         };
 
         // Add the new validator to the page validators array:
         Page_Validators.push(newValidator);
 
         // Wire-up the click event handler of the validation summary link
         $("a[href='#emailaddress1_label']").on("click", function () { scrollToAndFocus('emailaddress1_label','emailaddress1'); });
      });
   }(window.jQuery));
}

Validação geral

Ao clicar no botão Avançar/Enviar, uma função com nome webFormClientValidate é executada. É possível ampliar esse método para adicionar lógica personalizada de validação.

if (window.jQuery) {
   (function ($) {
      if (typeof (webFormClientValidate) != 'undefined') {
         var originalValidationFunction = webFormClientValidate;
         if (originalValidationFunction && typeof (originalValidationFunction) == "function") {
            webFormClientValidate = function() {
               originalValidationFunction.apply(this, arguments);
               // do your custom validation here
               // return false; // to prevent the form submit you need to return false
               // end custom validation.
               return true;
            };
         }
      }
   }(window.jQuery));
}

Consulte também

Observação

Você pode nos falar mais sobre suas preferências de idioma para documentação? Faça uma pesquisa rápida. (Observe que esta pesquisa está em inglês)

A pesquisa levará cerca de sete minutos. Nenhum dado pessoal é coletado (política de privacidade).