why is this not validating my select?

Question

I want to validate my form that includes inputs, and one select , but at the moment when I want to validate using $('#form').validate();, it works good with my inputs, but not with my select , how can I do it or edit my code to validate all together, but I am having problems with it . any ideas.

jquery

    $('#add').on('click', function() {
            $("#product").validate();  <<< validate 
            BootstrapDialog.show({
                type: BootstrapDialog.TYPE_PRIMARY,
                message: function(dialog) {
                    var $message = $('<div></div>');
                    var pageToLoad = dialog.getData('pageToLoad');
                    $message.load(pageToLoad);

                    return $message;
                },
                data: {
                    'pageToLoad': URL_GET_VIEW_PRODUCT
                },
                closable: false,
                buttons: [{
                    id: 'btn-ok',
                    cssClass: 'btn-primary',
                    icon: 'glyphicon glyphicon-send',
                    label: ' Save',
                    action: function(e) {
                        var description = $('#description').val();
                        var cost_price = $('#cost_price').val();
                        var selling_price = $('#selling_price').val();
                        var wprice = $('#wprice').val();
                        var min_stock = $('#min_stock').val();
                        var stock = $('#stock').val();
                        var max_stock = $('#max_stock').val();
                        var provider_id = $('#select_provider').val();
                        $("#product").validate({
                            rules: {
                                select_provider: {
                                    required: true
                                }
                            }
                        });
                        if ($("#product").valid()) {  <<< if any input if empty
show me red flag, but dont works with select 
                            $.ajax({
                                url: URL_GET_ADD_PRODUCT,
                                type: 'POST',
                                data: { provider_id: provider_id, description: description, cost_price: cost_price, selling_price: selling_price,  wprice: wprice, min_stock: min_stock, stock: stock, max_stock: max_stock }
                            }).done(function(data) {
                                if (data.msg == 'successfully added') {
                                    e.close();
                                    swal("successfully added", "", "success");
                                    table.ajax.reload();
                                } else if (data.min_stock == 'el stock no puede ser mayor al min') {
                                    BootstrapDialog.show({
                                        type: BootstrapDialog.TYPE_DANGER,
                                        message: 'el stock no puede ser mayor al min'
                                    });
                                }
                            });
                            return false;  
                        }
                    }
                }, {
                    id: 'btn-cancel',
                    cssClass: 'btn-danger',
                    icon: 'glyphicon glyphicon-remove',
                    label: ' Cancel',
                    action: function(e) {
                        e.close();
                    }
                }]
            });
        });

html

<form id="product">
   <div class="row">
   <div class="form-group">
   <div class="col-xs-12">
      <label for="description">Name: </label>
      <input type="text" class="form-control" id="description" name="aa" title="product description" required>
      <div>
      </div>
   </div>
   <div class="row">
      <div class="form-group">
         <div class="col-xs-8 col-sm-6">
            <label for="cost_price">Cost Price:</label>
            <div class="input-group"> <span class="input-group-addon">$</span>
               <input type="text" class="form-control input-group-lg reg_name" id="cost_price" name="cost_price" title="cost_price"  placeholder="Last name" required>
            </div>
         </div>
         <div class="col-xs-8 col-sm-6">
            <label for="selling_price">Selling price: </label>
            <input type="text" class="form-control input-group-lg reg_name" id="selling_price" name="selling_price" title="selling_price" placeholder="Last name" required>
         </div>
      </div>
   </div>
   <div class="row">
      <div class="form-group">
         <div class="col-xs-8 col-sm-6">
            <label for="wprice">Wholeprice: </label>
            <input type="text" class="form-control" id="wprice" name="wprice" title="wprice" required>
         </div>
         <div class="col-xs-8 col-sm-6">
            <label for="min_stock">Min stock: </label>
            <input type="text" class="form-control" id="min_stock" name="min_stock" title="min_stock" required>
         </div>
      </div>
   </div>
   <div class="row">
      <div class="form-group">
         <div class="col-xs-8 col-sm-6">
            <label for="stock">Stock: </label>
            <input type="text" class="form-control" id="stock" name="stock" title="stock" required>
         </div>
         <div class="col-xs-8 col-sm-6">
            <label for="max_stock">Max stock: </label>
            <input type="text" class="form-control" id="max_stock" name="max_stock" title="max_stock" required>
         </div>
      </div>
   </div>
   <div class="row">
      <div class="form-group">
         <div class="col-xs-8 col-sm-6">
            <label for="provider">Provider: </label>
            <select name="select_provider" id="select_provider" class="form-control" title="max_stock" required>
                <option value="0" >Select a provider</option>
                <?php foreach ($data as $value): ?>
                   <option value="<?php echo $value['id']; ?>"><?php echo $value['first_name'].' '.$value['last_name'] ?></option>
                <?php endforeach ?>
            </select>
         </div>
      </div>
   </div>
</form>

In your select list its value should be empty not 0 .Please check my answer that will solve your problem — Sagar Arora, Apr 18 '17 at 06:01
Please don't edit your question to fix code that was pointed out as incorrect in answers below. By doing so, you create confusion for future readers as the answers will no longer make any sense. I can't even roll it back because your original posting does not even contain the problem that was solved below... please be more careful in the future. — Sparky, Apr 18 '17 at 15:55

score 1 · Answer 1 · answered Apr 18 '17 at 05:47

1

Check the following line:

<select name="select_provider" id="select_provider" class="form-control" title="max_stock" required>

this dropdown is placed inside:

<form id="product_update">

and you are validating it with:

$("#product").validate();  // here formId is wrong. It is product_update

so change it to:

$("#product_update").validate();

and try again.

answered Apr 18 '17 at 05:47

Mayank Pandeyz

25,704
4
40
59

it didnt work.. – smith smith Apr 18 '17 at 05:54
Any error in console? – Mayank Pandeyz Apr 18 '17 at 05:55
1

@smithsmith, [the code you originally posted](http://stackoverflow.com/revisions/15cdf8b4-e9de-4646-97de-85cd124c4192/view-source) contained `$("#product").validate()`, which would be totally broken, and you later edited it to fix the problem identified by this answer. Please be more careful in the future when posting your code. – Sparky Apr 18 '17 at 22:02

score 1 · Answer 2 · answered Apr 18 '17 at 05:58

1

Just change your select first option:

From:

<option value="0" >Select a provider</option>

To:

 <option value="" >Select a provider</option>

Then it will validate select also.

answered Apr 18 '17 at 05:58

Sagar Arora

1,743
1
10
19

that was the problem. thanks – smith smith Apr 18 '17 at 06:04
@smithsmith if answer has solve your problem you may accept and vote up so that it help others too – Sagar Arora Apr 18 '17 at 06:14
@smithsmith, [the code you originally posted](http://stackoverflow.com/revisions/15cdf8b4-e9de-4646-97de-85cd124c4192/view-source) already contained ` – Sparky Apr 18 '17 at 22:01

why is this not validating my select?

2 Answers2