.validator('update') 不适用于动态添加的字段
Posted
技术标签:
【中文标题】.validator(\'update\') 不适用于动态添加的字段【英文标题】:.validator('update') not working for dynamically added fields.validator('update') 不适用于动态添加的字段 【发布时间】:2018-05-28 06:32:20 【问题描述】:我正在使用 Bootstrap (plugin): validator.js v0.11.9 bootstrap validator 在 Python 项目中进行字段验证(Python 3.6 版和 Django 1.11 版) .在按钮 click
上,我使用 jquery 在表单中添加了几个字段 -
jQuery :
$("#button1Id").click(function()
$("#divInsideFormId").append('filed1-selectoption, field2-datepicker, field3-textbox');
);
根据文档validator fields
默认情况下,验证器只会验证插件初始化时存在的字段。如果您的表单有一组动态字段,您需要调用 $(...).validator('update')
通知插件要验证的字段集已更改。
我尝试了以下 -
$("#button1Id").click(function()
$("#divInsideFormId").append('filed1-selectoption, field2-datepicker, field3-textbox');
$("#formId").validator('update');
);
这不起作用。我也试过-$("#divInsideFormId").append(...).validator('update');
即使这样也行不通。
谁能建议我的代码有什么问题或者我遗漏了什么?
【问题讨论】:
【参考方案1】:这是一个有效的 sn-p:
$("#button1Id").click(function()
var html = '<label for="inputName" class="control-label">New numeric field</label><input type="number" class="form-control" id="inputNum" placeholder="new num field" required>';
$("#divInsideFormId").append(html);
$("#formId").validator('update');
);
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/1000hz-bootstrap-validator/0.11.9/validator.min.js"></script>
<form id="formId" data-toggle="validator" role="form">
<div id="divInsideFormId" class="form-group">
</div>
<div class="form-group">
<label for="inputName" class="control-label">Name</label>
<input type="text" class="form-control" id="inputName" placeholder="Cina Saffary" required>
</div>
<div class="form-group has-feedback">
<label for="inputTwitter" class="control-label">Twitter</label>
<div class="input-group">
<span class="input-group-addon">@</span>
<input type="text" pattern="^[_A-z0-9]1,$" maxlength="15" class="form-control" id="inputTwitter" placeholder="1000hz" required>
</div>
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
<div class="help-block with-errors">Hey look, this one has feedback icons!</div>
</div>
<div class="form-group">
<label for="inputEmail" class="control-label">Email</label>
<input type="email" class="form-control" id="inputEmail" placeholder="Email" data-error="Bruh, that email address is invalid" required>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<label for="inputPassword" class="control-label">Password</label>
<div class="form-inline row">
<div class="form-group col-sm-6">
<input type="password" data-minlength="6" class="form-control" id="inputPassword" placeholder="Password" required>
<div class="help-block">Minimum of 6 characters</div>
</div>
<div class="form-group col-sm-6">
<input type="password" class="form-control" id="inputPasswordConfirm" data-match="#inputPassword" data-match-error="Whoops, these don't match" placeholder="Confirm" required>
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="form-group">
<div class="radio">
<label>
<input type="radio" name="underwear" required>
Boxers
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="underwear" required>
Briefs
</label>
</div>
</div>
<div class="form-group">
<div class="checkbox">
<label>
<input type="checkbox" id="terms" data-error="Before you wreck yourself" required>
Check yourself
</label>
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Submit</button>
<button id="button1Id" type="button" class="btn btn-default">Add field</button>
</div>
</form>
或等效的 jsfiddle:https://jsfiddle.net/beaver71/m90m178s/
【讨论】:
以上是关于.validator('update') 不适用于动态添加的字段的主要内容,如果未能解决你的问题,请参考以下文章
`updater` 不适用于 Relay Modern,因为 `ConnectionHandler.getConnection()` 返回 `undefined`
MySQL 查询适用于 SELECT 但不适用于 UPDATE 语句
SQL UPDATE 命令不适用于 Command.Parameters.Add/AddWithValue [重复]