Question

如何在Multiselect boostrap下拉列表中选择选择下拉列表中选择的Db值，如PHP？

例如Php编码，

$array = array("apple", "orange", "lemon");
<select>
<option value=""></option>
<?php
foreach ($array as $data) {
    ?>
    <option value="<?php echo $data ?>" <?php if ($data == "orange") echo "selected"; ?>><?php echo $data ?></option>
<?php } ?>

在php db值中选择使用Selected，如何在Boostrap Multiselect中使用js？

<button type="button" class="multiselect dropdown-toggle btn btn-default" data-toggle="dropdown" title="None selected">
None selected 
<b class="caret">
</b>

<ul class="multiselect-container dropdown-menu">
<li class="multiselect-item multiselect-all">
  <a href="javascript:void(0);" class="multiselect-all">
    <label class="checkbox">
      <input type="checkbox" name="multiselect" value="multiselect-all">
      Select all
    </label>
  </a>
</li>
<li>
  <a href="javascript:void(0);">
    <label class="checkbox">
      <input type="checkbox" name="multiselect" value="cheese">
      Cheese
    </label>
  </a>
</li>

如何在上面的boostrap multiselect js中设置值？喜欢在php中选择的选项吗？例如：如果db value coming cheese意味着Multiselect Dropdown中的选定值？

Answer 1

您可以使用插件的select功能

来实现

$(document).ready(function() {
  $('#example-getting-started').multiselect();

  $('#example-getting-started').multiselect('select', ['cheese', 'pepperoni']);
});

jsbin

Answer 2

根据我对您的问题的理解：您正在使用PHP生成带有其选项的select，并且您从数据库中检索选项及其选定/未选择状态。您的代码片段应该没问题，Bootstrap Multiselect会自动保留所选的选项（包括多种模式和单一模式）。请注意，在单一模式下（即通过单选按钮进行单选）， last 选择选项在Bootstrap Multiselect中预选，而在多模式下，将预选所有选定的选项。

<?php $array = array("apple", "orange", "lemon"); ?>
<select> <!-- Note that the multiple attribute needs to be present to allow multiple selection. -->
<!-- Removed the empty option, not sure what it was for ... -->
<?php foreach ($array as $data): ?>
    <option value="<?php echo $data ?>" <?php if ($data == "orange") echo "selected=\"selected\""; ?>><?php echo $data ?></option>
<?php endforeach; ?>
<!-- Do not forget closing tag. -->
</select>

<script type="javascript/text">
$(document).ready(function() {
     // Will preselect "orange" in single selection mode ...
     $('select').multiselect({
         includeSelectAllOption: true
     });
});
</script>

页面加载后，可以按照lcycool的描述操作多选。

如何从boostrap multiselect js中选择从db值中选择的box值？

2 个答案: