Data-required validation in select

Asked

Viewed 75 times

0

I have this code that it checks if there are any input with data-required which was not filled out, to inform the user. However I have 3 selects that are not being verified.

 $.each($('input[data-required="true"]'), function (e) {
        if (!this.value || this.value == '') {
            verificaform = 1;
            $(this).css('border', 'red 1px solid');
            var id = $($(this).parents('.tab-pane')[0]).attr('id');
            $('[href="#' + id + '"]').trigger('click');
            $(this).focus();
            e.preventDefault(); // Vai prevenir o submit do formulário
            return false; // Vai parar a execução do .each()
        }
        else {
            $(this).css('border', '#CCCCCC 1px solid');
        }

        if ($('#ClienteNovo').valid()) {
            verificaform = 0;
        }
    });

This is one of them

<label asp-for="CidadeEntrega" class="col-md-1 control-label" style="text-align:left;"></label>
 <div class="col-md-4">
         <select asp-for="CidadeEntrega" asp-items="@Model.CidadeEntregaList" required id="cbmunicipioentrega" class="form-control uppercase"> <option disabled selected>Selecione o Município</option></select>
         <span asp-validation-for="CidadeEntrega" class="text-danger"></span>
 </div>

How can I get them validated, because if they’re not filled in he lets it go the same way.

  • Try to do the selector thus $('select[required]'), that is, search for selects with the attr required, your selector is looking for inputs with attr data-required='true'

  • @Icaromartins is why I need to look for the input how can I adapt to both ?

  • you can put a , and stay like this $('input[data-required="true"],select[required]')

  • @Icaromartins when I do it that way $.each($('input[data-required="true"]','select[required]'), function (e) { doesn’t work, it doesn’t even work for input

  • 1

    The selector has to be this way selector = 'input[data-required="true"], select[required]', note that it is not 2 selectors. $( selector ).each( function(){ } ); - jQuery - Multiple Selector

  • 1

    @Icaromartins was just that, I was doing it the wrong way, so it didn’t work. Thank you.

Show 1 more comment

1 answer

2


In case you need to match the jQuery selectors using , between them see the example below:

/// ; Selector para retornar os inputs com attr data-require=true
$('input[data-required="true"]') 

/// ; Selector para retornar os selects com attr required
$('select[required]')


/// ; Para retornar os inputs com attr data-required=true &&
/// ; Para retornar os selects com attr required
$( 'input[data-required="true"], select[required]' )
//   ↑                         ↑   ↑
//   Selector1                 |   |
//                     separador   |
//                                 Selector2

/// var selector = 'input[data-required="true"], select[required]';
/// $( selector );

jQuery - Multiple Selector

Browser other questions tagged

You are not signed in. Login or sign up in order to post.