私はプロジェクトに取り組んでおり、検証に使用しているこの検証ライブラリに出会いました。ノックアウト制御フローバインディングで使い始めるまではうまくいきました。そのイベントは、ko が ko バインディングを使用しているテンプレートに登録されません。どんな助けでも大歓迎です。ありがとう。
$('#firewallRuleForm')
.find('[name="selectFirewallRule"]')
.change(function(e){
$('#firewallRuleForm').on('init.field.fv', function(e, data) {
// data.fv --> The FormValidation instance
// data.field --> The field name
// data.element --> The field element
var $parent = data.element.parents('.form-group'),
$icon = $parent.find('.form-control-feedback[data-fv-icon-for="' + data.field + '"]');
// You can retrieve the icon element by
// $icon = data.element.data('fv.icon');
$icon.on('click.clearing', function() {
// Check if the field is valid or not via the icon class
if ($icon.hasClass('glyphicon-remove')) {
// Clear the field
data.fv.resetField(data.element);
}
});
}).formValidation({
framework: 'bootstrap',
icon:{
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
selectFirewallRule: {
validators: {
notEmpty: {
message: 'Firewall Rule Type is required'
}
}
},
firewallRuleName:{
validators: {
notEmpty: {
message: 'The Firewall Rule name is required'
}
}
},
setPacketWrite:{
validators: {
notEmpty: {
message: 'The Packet write is required'
}
}
}
}
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<form id="firewallRuleForm" class="form-horizontal " data-bind="with: formModel">
<div class="form-group">
<label class="col-xs-2 control-label">Rule type</label>
<div class="col-xs-4">
<select name="selectFirewallRule" class="form-control select2-select" style="width:208px" data-bind="value: selectedFirewallRuleType, valueAllowUnset: true, select2: {}">
<option value="">Choose Rule type</option>
<option value="Standard">Standard</option>
<option value="Rate limit">Rate limit</option>
<option value="Packet Rewrite">Packet Rewrite</option>
<option value="Rate limit queue Bypass">Rate limit queue Bypass</option>
<option value="Wifi">Wifi</option>
</select>
</div>
</div>
<!-- ko if: (selectedFirewallRuleType() == 'Packet Rewrite' || selectedFirewallRuleType() == 'Standard' || selectedFirewallRuleType() == 'Wifi') -->
<div id="standardRuleForm">
<div class="form-group" >
<label class="col-xs-2 control-label">Rule name</label>
<div class="col-xs-4 ">
<input type="text" class="form-control" name="firewallRuleName" placeholder="Enter the name of the rule" data-bind="textInput: ruleName"/>
</div>
<!-- ko if: (selectedFirewallRuleType() !== 'Packet Rewrite' ) -->
<div class="col-xs-offset-2 col-xs-2">
<div class="checkbox">
<label><input type="checkbox">Log Matches? </label>
</div>
</div>
<!-- /ko -->
</div>
<!-- ko if: (selectedFirewallRuleType() == 'Packet Rewrite') -->
<div class="form-group">
<label class="col-xs-2 control-label">Set</label>
<div class="col-xs-4">
<select class="form-control select2-select" name="setPacketWrite" data-bind="value : packetRewriteSet , valueAllowUnset: true, select2: {}">
<option value="">Choose packet</option>
<option value="MSS">MSS</option>
<option value="WSCALE">WSCALE</option>
</select>
</div>
</div>
<!-- /ko -->