javascript - js mysql php select2.js 向下拉列表添加 2 个值 其中一个应该从 js 调用

Question

请帮助了解如何将当前选择的颜色调用到下拉列表中的选项。

下拉列表:

数据库:

php代码:

<select data-placeholder="Escolha Categoria..." class="select-search" name="categoria_id" tabindex="2" id="category_drop">
                                    <option value="">Categoria</option>
                                    <?php foreach($categorias_produtos as $categoria_produto){ ?>
                                        <option value="<?php echo $categoria_produto->categoria_id; ?>"><?php echo $categoria_produto->categoria_nome; ?></option>
                                        <?php } ?>
                                    </select>

js代码:

<script>
function format(produto) {
    if (!produto.id) return produto.text; // optgroup
    return "<em class='fa fa-circle space_for_product' style='color:<?php

    foreach($categorias_produtos as $categoria_produto){
        echo $categoria_produto->categoria_cor;
    }

    ?>'></em>" + produto.text;
}
$("#category_drop").select2({
  formatResult: format
});

这是结果:

<div class="select2-result-label"><em class="fa fa-circle space_for_product" style="color:#ff0040;#ff4000;#00ff40;#00bfff;#ffff00;#bfff00;#4000ff;#ffbf00;#ff00bf;"></em>Farinhas</div>

那么如何从数据库中为下拉列表中的每个项目调用正确的颜色？

Answer 1

要解释的 PHP 代码必须通过服务器。

对于 javascript，是浏览器中的控制台执行的。所以如果你把一些 php 放在 Js 代码里面。它不会起作用。

解决方案是先获取颜色并将它们写入一个带有 id 的不可见 block 中，然后通过 javascript 获取值

 <?php 
      echo '<div id="colors" display = "none">';
      foreach ($ categorias_produtos as $ categoria_produto) {
         echo "$ categoria_produto-> categoria_cor"." ,";
     }
       echo '</ div>';
 ?>

然后你将使用:

<script>
        colorString = document.getElementById("colors").value;
        colorArray = colorString.split(",");
</script>

我希望这对你有用。美好的一天。