【发布时间】:2015-11-20 22:06:57
【问题描述】:
嗨,我想在引导模式中验证输入
通常我使用这样的东西
<input type="text" class="form-control" id="kode" name="kode" placeholder="Kode" required />
或像这样使用jquery validating plugins
$("#formTest").validate({
rules: {
kode: "required"
}
});
但他们都没有在引导模式中处理输入
我在哪里失踪?
@update
<button class="btn btn-primary form-button" id="addNew">Tambah Produk</button> //button to show modal
<form method="post" id="formTest" action="">
Username : <input type="text" id="username" class="form-control" name="username" required>
<button class="btn btn-primary" type="submit"></button
</form>
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Modal Default</h4>
</div>
<div class="modal-body">
<form method="post" id="formProduk" action="{{ URL::route('produk.post') }}">
<div class="row form-group ">
<label for="kode_barang" class="control-label col-sm-3">Kode Barang<span class="required">*</span></label>
<div class="col-sm-9">
<input type="text" class="form-control" id="kode_barang" name="kode_barang" placeholder="Kode Barang" required />
</div>
</div>
<button type="button" class="btn btn-primary" type="submit" id="saveData">Save</button>
</form>
</div>
</div>
</div>
</div>
在我上面的代码中,我有两种形式 formTest 和 formProduk
我在formTest 中验证没有问题,只需输入required 属性
同时在formProduk
我已经在输入id=kode_barang中使用required
但是在我点击按钮 save
之后,它只是解析而不验证到 url produk.post
【问题讨论】:
-
您是否收到任何 JavaScript 错误?您的模式输入是在页面呈现后动态创建的吗?还是页面加载时modal中的输入字段已经存在?
-
显示足够的代码来创建问题的工作演示。否则,您发布的一小段代码没有任何问题。
-
你不应该使用
<button type="button" class="btn btn-primary" type="submit" id="saveData">Save</button>2type属性 -
除了 ^^^^^ 验证在两种表单(页面和模态)上都不起作用jsfiddle.net/m11gaaok/1 只需删除
type="button"表单模态表单之外没有其他原因 -
如前面的 cmets 所述,您不能在同一元素上同时拥有
type="button"和type="submit"。删除前者。
标签: jquery twitter-bootstrap jquery-validate bootstrap-modal