joris

JQuery Append

May 8th, 2012
131
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. $(document).ready(function() {
  2.     TampilData();
  3. });
  4.        
  5.        
  6. function TampilData(){
  7.     var count = 0;
  8.    
  9.    
  10.     $("#add_btn").click(function(){
  11.     count += 1;
  12.     $('#container').append(
  13.              '<tr class="records">'
  14.            + '<td><div class="uiBoxLightblue" id="'+count+'">' + count + '</div></td>'
  15.            + '<td><select id="kordinasi_' + count + '" name="kordinasi_' + count + '" class="inputtext"><option value="ho" selected >HO</option><option value="sumbagut">RO [SUMBAGUT]</option><option value="sumbagteng">RO [SUMBAGTENG]</option><option value="sumbagsel">RO [SUMBAGSEL]</option><option value="jakarta">RO [JAKARTA]</option><option value="jabar">RO [JABAR]</option><option value="jateng">RO [JATENG]</option><option value="jatim">RO [JATIM]</option><option value="kalimantan">RO [KALIMANTAN]</option><option value="bali">RO [BALI]</option><option value="kti">RO [KTI]</option></select></td>'
  16.            + '<td><input class="inputText2" id="kontak_' + count + '" name="kontak_' + count + '" type="text"></td>'
  17.            + '<td><select id="jam_' + count + '" name="jam_' + count + '" class="inputtext"><option value="12:00AM" selected >12:00AM</option><option value="01:00AM">01:00AM</option><option value="02:00AM">02:00AM</option><option value="03:00AM">03:00AM</option><option value="04:00AM">04:00AM</option><option value="05:00AM">05:00AM</option><option value="06:00AM">06:00AM</option><option value="07:00AM">07:00AM</option><option value="08:00AM">08:00AM</option><option value="09:00AM">09:00AM</option><option value="10:00AM">10:00AM</option><option value="11:00AM">11:00AM</option><option value="12:00PM">12:00PM</option><option value="01:00PM">01:00PM</option><option value="02:00PM">02:00PM</option><option value="03:00PM">03:00PM</option><option value="04:00PM">04:00PM</option><option value="05:00PM">05:00PM</option><option value="06:00PM">06:00PM</option><option value="07:00PM">07:00PM</option><option value="08:00PM">08:00PM</option><option value="09:00PM">09:00PM</option><option value="10:00PM">10:00PM</option><option value="11:00PM">11:00PM</option></select></td>'
  18.            + '<td><input class="inputText2" id="job_" name="job_' + count + '" maxlength="255" type="text"></td>'
  19.            + '<tr><td></td><td style="text-align:center">Media</td><td style="text-align:center">Hasil Kordinasi</td><td style="text-align:center">Format : 2012-12-25</td></tr>'
  20.            + '<tr><td></td><td><select id="media_' + count + '" name="media_' + count + '" class="inputtext"><option value="Telephone" selected>Telephone</option><option value="Email">Email</option><option value="bbm">BBM</option><option value="GTALK/YM">GTALK/YM</option><option value="SMS">SMS</option><option value="H2H">H2H</option></select></td><td><select id="status_' + count + '" name="status_' + count + '" class="inputtext"><option value="Done" selected>Done</option><option value="On Progress">On Progress</option></select></td><td><input class="inputText2" id="date_' + count + '" name="date_' + count + '" type="text"></td></tr>'
  21.            // + '<td><input class="FieldTanggal" id="jam" name="jam' + count + '" maxlength="255" type="text"></td>'
  22.            +'<tr><td class="uiBoxYellow">Next Data</td></tr>'
  23.            + '<input id="rows_' + count + '" name="rows[]" value="'+ count +'" type="hidden"></td>'
  24.             );
  25.         });
  26.        
  27.         $(".remove_item").live('click', function (ev) {
  28.             if (ev.type == 'click') {
  29.                 $(this).parents(".records").fadeOut();
  30.                 $(this).parents(".records").remove();
  31.                 count -= 1;
  32.             }
  33.         });
  34.        
  35.        
  36.  
  37. }
Advertisement
Add Comment
Please, Sign In to add comment