javascript - 在codeigniter中使用javascript将组合框添加到html

Question

我的代码有什么问题，组合框没有显示，在我的代码中我使用 php 组合框

首先点击按钮

代码:

<div class="form-group">
   <a id="tambah_field" class="btn btn-sm btn-white1">Tambah Bahasa</a>
</div>

下一个输出组合框就像这样 代码:

<div class="form-group">
     <h4>Tingkat penguasaan</h4>
          <?php
             $dropdown = array(
                "[Tingkat penguasaan]"=>"[Tingkat penguasaan]",
                "Basic"=>"Basic",
                "Intermediate"=>"Intermediate",
                "Advance"=>"Advance"
             );
           echo form_dropdown("tingkat_penguasaan[]", $dropdown, @$result->tingkat_penguasaan, 'class="form-control" id="tingkat_penguasaan"');
           ?>  
</div>

并使用div输出

代码:

<div id="fields" class="form-group">
    <!-- for output -->                    
</div>

这里是 JavaScript

<script type="text/javascript">
  $(document).ready(function() {
    $('#tambah_field').click(function() {
        $('#fields').append(
            $('<h4>Bahasa</h4>'),
            $('<input type="text" class="form-control" placeholder="Nama prestasi" required="required" name="bahasa[]" value="<?php echo @$result->bahasa?>">'),
            $('<h4>Tingkat penguasaan</h4>'),
            $('<?php
                      $dropdown = array(
                      "[Tingkat penguasaan]"=>"[Tingkat penguasaan]",
                      "Basic"=>"Basic",
                      "Intermediate"=>"Intermediate",
                      "Advance"=>"Advance"
                      );
                      echo form_dropdown("tingkat_penguasaan[]", $dropdown, @$result->tingkat_penguasaan, 'class="form-control" id="tingkat_penguasaan"');
                    ?>  '),
            $('<h4>Skor</h4>'),
            $('<input type="text" class="form-control" placeholder="Skor" name="skor[]" value="<?php echo @$result->skor?>">'),
            $('<br/>')
        );
    })
});

抱歉，我的 ini stackoverflow 编辑不当，我是新来的:)

Answer 1

将其插入到“下一个输出组合框”的顶部:

<div class="tambah-form" style="display: none;">
    <h4>Bahasa</h4>
    <input type="text" class="form-control" placeholder="Nama prestasi" required="required" name="bahasa[]" value="<?php echo @$result->bahasa?>">

    <h4>Tingkat penguasaan</h4>
    <?php
        $dropdown = array(
        "[Tingkat penguasaan]"=>"[Tingkat penguasaan]",
        "Basic"=>"Basic",
        "Intermediate"=>"Intermediate",
        "Advance"=>"Advance"
        );
        echo form_dropdown("tingkat_penguasaan[]", $dropdown, @$result->tingkat_penguasaan, 'class="form-control" id="tingkat_penguasaan"');
    ?>
    <h4>Skor</h4>
    <input type="text" class="form-control" placeholder="Skor" name="skor[]" value="<?php echo @$result->skor?>">
    <br/>
</div>

然后替换所有 jQuery 代码，如下所示:

$('#tambah_field').click(function() {
    $('#fields').append($(".tambah-form:eq(0)").clone(true));
    $('.tambah-form').eq(-1).find('input').val('');
    $('.tambah-form').eq(-1).find('select').val('');
    $('.tambah-form').eq(-1).removeAttr('style');
});

对我来说效果很好。 Salam 程序员印度尼西亚:)