嵌套的每个 html 循环内的单选按钮不会检查
我有多个 for 循环,每个循环都与相关的项目列表绑定。 例子: 层。 修订。 接触。 每个都重复 n 次,并按以下方式循环
self.exposureArray = ko.observable("Combined");
self.current_litho_layer_definition.subscribe(function(new_def) {
if (!new_def) return;
self.is_fetching(true);
self.message_for_fetching("Fetching layer: " + new_def.layer_name + " ...");
$.ajax('webapi/layer/arrays/'+new_def.layer_definition_sk, {
dataType: 'json',
data: {expose_array_names: self.exposureArray},
success: function(arrs) {
self.current_litho_exposure_arrays(arrs);
},
complete: function() {
self.is_fetching(false);
self.message_for_fetching("");
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/2.0.0/knockout-min.js"></script>
<div style="position:absolute;top:600px">
<h4>Litho Layers</h4>
<hr class="no-margin"/>
<!-- ko foreach: litho_layer_name_selected_definitions -->
<div class="well pull-left clearfix " style="height:200px;margin:5px;width:90px;padding:5px;" data-bind="click: $root.select_litho_layer_definition, css: {'background-highlight': $root.current_litho_layer_definition() === $data}">
<p class="text-center tight-padding no-margin"><strong data-bind="text: layer_name"></strong></p>
<div class="btn-group" style="width:90px">
<button class="btn btn-mini dropdown-toggle" data-toggle="dropdown" style="width:90px">
<span data-bind="text: 'Rev.' + revision"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu small-list" data-bind="foreach: $root.litho_layer_name_definitions()[_.indexOf($root.litho_layer_names(), layer_name)]" style="width:90px">
<li><a data-bind="text: 'Rev.' + revision, click: $root.litho_layer_name_select_revision"></a></li>
</ul>
</div>
<!-- ko foreach: exposure_array_names -->
<input type="radio" name="layer_name" value ="$root.exposureArray" id="$root.createId"
data-bind="click: $root.select_litho_layer_definition,
checkedValue:$data,
uniqueName: true,
checked:$root.exposureArray" />
<span data-bind="text: $data"></span><br>
<!-- /ko -->
</div>
I have multiple for loops and each are being bind with relevant list of items.
Example:
Layer.
revision.
exposure.
and each of these are repeated n number of times and they are looped in following way
self.exposureArray = ko.observable("Combined");
self.current_litho_layer_definition.subscribe(function(new_def) {
if (!new_def) return;
self.is_fetching(true);
self.message_for_fetching("Fetching layer: " + new_def.layer_name + " ...");
$.ajax('webapi/layer/arrays/'+new_def.layer_definition_sk, {
dataType: 'json',
data: {expose_array_names: self.exposureArray},
success: function(arrs) {
self.current_litho_exposure_arrays(arrs);
},
complete: function() {
self.is_fetching(false);
self.message_for_fetching("");
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/2.0.0/knockout-min.js"></script>
<div style="position:absolute;top:600px">
<h4>Litho Layers</h4>
<hr class="no-margin"/>
<!-- ko foreach: litho_layer_name_selected_definitions -->
<div class="well pull-left clearfix " style="height:200px;margin:5px;width:90px;padding:5px;" data-bind="click: $root.select_litho_layer_definition, css: {'background-highlight': $root.current_litho_layer_definition() === $data}">
<p class="text-center tight-padding no-margin"><strong data-bind="text: layer_name"></strong></p>
<div class="btn-group" style="width:90px">
<button class="btn btn-mini dropdown-toggle" data-toggle="dropdown" style="width:90px">
<span data-bind="text: 'Rev.' + revision"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu small-list" data-bind="foreach: $root.litho_layer_name_definitions()[_.indexOf($root.litho_layer_names(), layer_name)]" style="width:90px">
<li><a data-bind="text: 'Rev.' + revision, click: $root.litho_layer_name_select_revision"></a></li>
</ul>
</div>
<!-- ko foreach: exposure_array_names -->
<input type="radio" name="layer_name" value ="$root.exposureArray" id="$root.createId"
data-bind="click: $root.select_litho_layer_definition,
checkedValue:$data,
uniqueName: true,
checked:$root.exposureArray" />
<span data-bind="text: $data"></span><br>
<!-- /ko -->
</div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论