为什么这不能验证我的选择？

Question

我想验证包含输入和一个选择的表单，但是当我想使用$('#form').validate();进行验证时，它适用于我的输入，但不适合我的选择，我该怎么办？它或编辑我的代码以一起验证所有，但我遇到了问题。任何想法。

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>

Answer 1

检查以下一行：

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

此下拉列表位于：

<form id="product_update">

您正在使用以下方式进行验证：

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

所以将其改为：

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

再试一次。

Answer 2

只需更改您的第一个选择选项：

来自：

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

要：

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

然后它也会验证select。