PHP JQUERY 中的 SELECT 选项的 FOREACH 循环 PHP

Question

我在 table.

里面有一个工作的 select 盒子

<tr>
    <td>
        <select name="type" class="inputbox input_table2 table2_index_4" id="item_type">
            <?php foreach ($item_type as $type) { ?>
                <option value="<?php echo $type->id ?>"><?php echo $type->name ?></option>
            <?php } ?>
        </select>
    </td>
</tr>

这是我的场景我的 table 行附加了触发按钮那么如何在 jQuery

中编写这个循环

我是 JavaScript 库的新手，这就是我在 JQuery

中尝试的

    <?php

$addtablerow = '    
        $(document).on("click",".add_row_button",function(e) {           
            e.preventDefault();
            var add_new_row = "<tr class=\'row\'> \ 
                                    <td><select name=\'type\' id=\'item_type\' class=\'item_type\'> \ 
                                        <?php foreach ($item_type as $type) { ?> \
                                            <option vlaue=\'<?php echo $type->id ?>\'> <?php echo $type->name ?> </option> \ 
                                        <?php } ?> \
                                        </select> \ 
                                    </td> \ 
                                </tr>";
            $("table#item_type tbody").append(add_new_row);
            indexassigner(); 
        });       
        ';
$this->registerJs($addtablerow, View::POS_READY);
?>

谢谢

Answer 1

作为您的第一个 select-box 即：type 对于所有 trs 都是相同的，您可以使用 clone() 方法获取第一个 select-box 的克隆，它可能已经存在在您的 table 中，然后将其传递给动态生成的 html 代码。

演示代码 :

$(document).on("click", ".add_row_button", function(e) {
  e.preventDefault();
  var slects = $('#item_type  tr:first').find("select[name=type]").clone(); //get options clone them
  var add_new_row = "<tr class='row'><td><select name = 'type' id='item_type' class='item_type'>" + $(slects).html() + "</select></td> </tr>"; //same same inside slect-box
  $("table#item_type tbody").append(add_new_row);
  //indexassigner();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="item_type">
  <tbody>
    <tr>
      <td>
        <select name="type" class="inputbox input_table2 table2_index_4" id="item_type">
        <!--dummy datas-->
          <option value="1">X</option>
          <option value="2">Y</option>
          <option value="3">Z</option>

        </select>
      </td>
    </tr>
  </tbody>
</table>

<button class="add_row_button">Add more </button>

Answer 2

感谢@Swati 向我介绍了 clone() 属性，谢谢你，因为我以前不知道。这是我发现的最简单的方法，只需将 PHP 代码作为字符串附加到 jQuery.

里面table

    <tr>
    <td>
        <select name="type[]" class="item_type inputbox input_table2 table2_index_4">
            <?php
            $code_as_string = "<select name='type[]' class='item_type inputbox input_table2' >";
            foreach ($item_type as $type) {
            ?>
                <option value="<?php echo $type->id ?>"><?php echo $type->name ?></option>
            <?php
                $code_as_string .= "<option value='" . $type->id . "'>" . $type->name . "</option>";
            }
            $code_as_string .= "</select>";
            ?>
        </select>
    </td>
</tr>

并简单地将变量 $code_as_string 附加到 jQuery 部分

    <?php

$addtablerow = '    
        $(document).on("click",".add_row_button",function(e) {           
            e.preventDefault();
            var add_new_row = "<tr class=\'row\'><td>' . $code_as_string . ' </td>  </tr>";                   
            $("table#item_type tbody").append(add_new_row);
            indexassigner(); 
        });       
        ';
$this->registerJs($addtablerow, View::POS_READY);
?>

PHP JQUERY 中的 SELECT 选项的 FOREACH 循环 PHP

PHP FOREACH LOOP FOR SELECT OPTION IN JQUERY INSIDE PHP

javascript

php

jquery

yii2