2016-12-10 7 views
1

テーブルrowを複製しようとしています。しかし、私はtrタグなしで何をクローンすることしかできません。私はそれを修正するにはどうすればよいクローン化trをクローン化していない

$(".tr_clone_add").on('click', function() { 
 
    $('.tr_clone').last().clone({ 
 
    withDataAndEvents: true 
 
    }).insertBefore('.tr_clone_add:first'); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 
<table class="table table-striped table-bordered" cellspacing="0" width="100%"> 
 

 
    <thead> 
 
    <tr> 
 
     <td>Hari</td> 
 
    </tr> 
 
    </thead> 
 

 

 
    <tbody> 
 
    <tr class="tr_clone"> 
 
     <td> 
 
     <select id="dropdown" class="form-control" name="hari[]"> 
 
      <option>Senin</option> 
 
      <option>Selasa</option> 
 
      <option>Rabu</option> 
 
      <option>Kamis</option> 
 
      <option>Jumat</option> 
 
     </select> 
 

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

 
<input type="button" name="add" value="Tambah Baris" class="tr_clone_add">

私のスクリプトを確認してください?私の悪い英語のために申し訳ありません。

+5

問題は、あなたがそれをテーブルに追加されていないで、tr_clone_addは '.insertBefore( 'tr_clone。:最初の' ....ボタンです); ' – epascarello

答えて

2

最初に、clone()はオブジェクトではなく最初のパラメータとしてブール値を受け入れることに注意してください。

第2に、tr要素をボタンの前に追加していて、表の中に追加していないためです。代わりに、このようなappendTo('table tbody')を使用してみてください:

$(".tr_clone_add").on('click', function() { 
 
    $('.tr_clone').last().clone(true).appendTo('table tbody'); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 
<table class="table table-striped table-bordered" cellspacing="0" width="100%"> 
 
    <thead> 
 
    <tr> 
 
     <td>Hari</td> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr class="tr_clone"> 
 
     <td> 
 
     <select id="dropdown" class="form-control" name="hari[]"> 
 
      <option>Senin</option> 
 
      <option>Selasa</option> 
 
      <option>Rabu</option> 
 
      <option>Kamis</option> 
 
      <option>Jumat</option> 
 
     </select> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<input type="button" name="add" value="Tambah Baris" class="tr_clone_add">

関連する問題