Inline Validations

As validações inline são validações apresentadas ao utilizador da aplicação ao nível do campo a que esta se refere.

Esta apresentação é efetuada com a colocação de um ícone de validação do lado esquerdo do campo, com a respetiva tooltip que, após o hover (clicando em tablet/mobile) neste ícone apresenta a mensagem de erro correspondente:

Exemplo Inline Validation

Estas validações aparecem sempre que o valor de um campo seja inválido, ou se o campo, sendo obrigatório, estiver vazio (após ter sido apagado o seu valor).

Quando um campo é obrigatório, e se encontra vazio, as validações inline também são verificadas, no entanto, o ícone de validação do campo não é apresentado, uma vez que todos os campos obrigatórios já se encontram assinalados como tal, sendo apresentada a sua border a cor laranja.

Assim, quando ocorre um "lost focus" sobre um qualquer atributo com validações, então as validações são testadas e caso não passem o atributo fica em erro.

Após o preenchimento do campo com valores válidos, a respetiva validação desaparece.

Nota: Os campos do tipo email e telefone têm validações do lado do cliente, e apenas submetem o valor para o servidor quando estão corretos.

Dependendo da especificidade da validação pretendida, podem usar-se validação pré-definidas (as quais dependem do tipo de campo ao qual se pretende atribuir a validação), ou pode ser necessária a utilização de custom validations que implicam a sua codificação.

Em ambos os casos é necessária a intervenção do modelo de entidades, de forma a efetuar a atribuição da validação ao campo pretendido.

Modelo de Entidades

Para definir validações inline é necessário aceder ao modelo de entidades, e selecionar a entidade e o campo ao qual pretendemos associar uma validação. Após isto, nas propriedades do atributo existe a área “Validation Rules”, onde deverá ser definida a expressão a utilizar.

Modelo de Entidades - Inline Validation

Para adicionar a regra de validação basta, no editor de regras de validação, selecionar a opção “Rules for ‘Quantity’…” e clicar no botão direito do rato. Após isto é aberta nova janela para a seleção da regra pretendida.

A este nível, a lista de regras disponíveis variará de acordo com o tipo de campo selecionado, sendo que a opção “CustomValidationRule” estará sempre disponível.

Adição de regra

No caso de ser selecionada uma regra pré-definida, ao selecionar a mesma, serão apresentados os atributos adicionais para preenchimento que serão utilizados como referência para a validação e para a definição da mensagem de erro.

Por sua vez, a opção CustomValidationRule deve ser selecionada quando se pretende uma regra para validação mais específica, implicando a sua codificação.

Exemplo de implementação de custom validation

Neste exemplo é demonstrada a validação do tamanho do campo código postal, dependendo do país selecionado.

public override ValidationResult ValidateLoadingPostalZone(object value, ValidationContext validationContext)
        {
            ValidationResult result = ValidationResult.Success;

            SmartGuard.NotNull(() => validationContext, validationContext);

            Order document = validationContext.ObjectInstance as Order;

            if (document != null &&
                !string.IsNullOrEmpty(document.LoadingPostalZone) &&
                !string.IsNullOrEmpty(document.LoadingCountryNaturalKey))
            {
                using (OrdersManager mng = new OrdersManager())
                {
                    var countryPostalLimits = mng.EntityContext.Countries
                        .Where(c => c.Id == document.LoadingCountryId && !c.IsDeleted)
                        .Select(c => new { c.PostalCodeMaxLength, c.PostalCodeMinLength, c.Name }).FirstOrDefault();

                    if (countryPostalLimits.PostalCodeMaxLength != null || countryPostalLimits.PostalCodeMinLength != null)
                    {
                        if (countryPostalLimits.PostalCodeMaxLength != null &&
                                countryPostalLimits.PostalCodeMaxLength != null &&
                                    countryPostalLimits.PostalCodeMaxLength == countryPostalLimits.PostalCodeMinLength &&
                                    document.LoadingPostalZone.Length != countryPostalLimits.PostalCodeMaxLength)
                        {
                            return new ValidationResult(CustomResources.RES_InvalidPostalCodeLength.FormatText(countryPostalLimits.Name, countryPostalLimits.PostalCodeMaxLength));
                        }
                        else
                        {
                            if (countryPostalLimits.PostalCodeMaxLength != null && document.LoadingPostalZone.Length > countryPostalLimits.PostalCodeMaxLength)
                            {
                                return new ValidationResult(CustomResources.RES_InvalidMaxPostalCodeLength.FormatText(countryPostalLimits.Name, countryPostalLimits.PostalCodeMaxLength));
                            }

                            if (countryPostalLimits.PostalCodeMinLength != null && document.LoadingPostalZone.Length < countryPostalLimits.PostalCodeMinLength)
                            {
                                return new ValidationResult(CustomResources.RES_InvalidMinPostalCodeLength.FormatText(countryPostalLimits.Name, countryPostalLimits.PostalCodeMinLength));
                            }
                        }
                    }
                }
            }

            return result;
        }

Nota: Para informação mais detalhada de como criar validações custom clicar aqui.

Inline Validations na View

Sempre que existem validações inline ao nível dos campos são, igualmente apresentadas as validações na própria view, com a informação do campo em erro.

Assim, enquanto o botão ‘Save’ não está disponível, junto a este aparece o ícone dos erros inline e no hover do mesmo (clicando em tablet/mobile) mostra uma tooltip que indica todos os campos que estão a faltar ou em erro, bem como a área em que o respetivo campo se encontra (expander\extensão\container).

Quando os campos em erro se referem a grelhas, na tooltip também é apresentada a informação da linha em erro.

No caso dos expanders, quando o mesmo está fechado, é apresentado o ícone de validação junto do título do expander. Ao abrir, o ícone deixa de estar visível no título e passa a ser apresentado no respetivo campo.

Modelo de Entidades - Expressão Inline Validation