CODEWITHSUNDEEP
javascriptcodeignitercombobox
irfanhans
irfanhans

Reputation: 55

Add combobox to html using javascript in codeigniter

what wrong with my code , the combobox not show , in my code i using php combobox

first click the button

code : 

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

next output combobox like that Code :

<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>

and output using div

code :

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

Here the 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/>')
        );
    })
});

sorry for bad editing ini stackoverflow , i'm new in here :)

Upvotes: 0

Views: 141

Answers (1)

imbagila
imbagila

Reputation: 513

Insert this on top of your "next output combobox":

<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>

And then replace all of your jQuery code like this one :

$('#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');
});

Works fine for me. Salam programmer Indonesia :)

Upvotes: 1

Related Questions