我想验证包含输入和一个选择的表单,但是当我想使用$('#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>
答案 0 :(得分: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();
再试一次。
答案 1 :(得分:1)
只需更改您的第一个选择选项:
来自:
<option value="0" >Select a provider</option>
要:
<option value="" >Select a provider</option>
然后它也会验证select
。