Jquery clone

[reiniger]

Sveiki

Gribu panakt lietu ka pievienojas tabulai jauns tr.

<table class="galvenatabula" id="rate_table" cellspacing="0" cellpadding="0">
   <tr class="head">
       <td>Type</td>
       <td> </td>
       <td>Nett</td>
       <td>Sale</td>
       <td>Profit</td>
   </tr>
   <tr class="rate_">
       <td><input name="ri_type[]" /></td>
       <td>
       <select name="ri_prop[]">
           <option></option>
           <option value="1">1</option>
           <option value="2">2</option>
       </select>
       </td>
       <td><input name="ri_net[]" /></td>
       <td><input name="ri_sel[]" /></td>
       <td>+100</td>
   </tr>
</table>

<a id="add_RateIdea" class="pointer_">add</a>

un scripts

<script>
$('#add_RateIdea').click(function(){                                      
$('.rate_').clone().appendTo("#rate_table");    
});
</script>

Problema ko jau rakstot zināju kad tiek clonēti visi tr ar clasi .rate_ ar katru nākošo spiedienu dubultojas tas neder.

 

Kā panākt ka var tikai vienu pievienot?

 

un vēl viena lieta kā panākt ka tiek automātiski aprēķināts Profit = sel - net katram clone elementam?

Edited October 10, 2011 by reiniger

[reiniger]

Atrisinaju problēmu ar pievienot tikai vienu.

<tr class="rate_ firstone">...

un Jquery

<script>
$('#add_RateIdea').click(function(){                                      
$('.firstone').clone().removeClass('firstone').appendTo("#rate_table");    
});
</script>

un vēl viena lieta kā panākt ka tiek automātiski aprēķināts Profit = sel - net katram clone elementam?

Kā panākt ka šis automātiski strādā uz clonētajiem elementiem?

Edited October 10, 2011 by reiniger

[reiniger]

Mana risinājumā ir viena nepilnība. Ja esmu pirmajā tr elementā savadījis datus, tad tie ar tiek noklonēti!

 

Kā panēkt ka clonē ar tukšiem input laukiem?

 

Atrisināju šo problēmu:

.firstone {display:none}

Un pievienoju vienu tukšu bez šīs klases.

 

Un tagad palicies pēdējā lieta ko nezinu pat kādā virzienā skatīties, lai man profit aprēķinātos no ri_sel[] - ri_net[], katrai tr rindiņai atsevišķi!

Edited October 10, 2011 by reiniger

[codez]

Pirmo iegūst ar :first selektoru:

 

$('.rate_:first')

 

 

 

Savukārt profit aprēķini, tad kad pievieno jaunu tr klonu.

Edited October 10, 2011 by codez

[reiniger]

$('.rate_:first')

Bet tad jau šādā veidā, ja pirmajā .rate_ man ir ievadīti dati, tie arī tiek noklonēti un tas nav labi.

Savukārt profit aprēķini, tad kad pievieno jaunu tr klonu.

Kā tieši šo tu biji domājis? Ne jau tā ka katru pēdējo tikai aprēķina kad tiek pievinots jauns! Kas notiktos ja es gribētu kādu no pirmajiem sel palabot vai tad arī tur profits tiktu aprēķināts?

Edited October 10, 2011 by reiniger

[briedis]

pirmajā .rate_ man ir ievadīti dati, tie arī tiek noklonēti un tas nav labi.

 

Bet kur ir problēma ar JS tos datus uzstādīt uz defaultajiem uzreiz pēc klonēšanas?

[daGrevis]

Nelasīju topiku, bet pats saskāros ar līdzīgu problēmu.

 

Uztaisi tagu ar visiem defaultajiem parametriem, defaultajiem stiliem... visu defaulto. Un uzliec: display: none.

 

Tad, piemēram, ja vajag parādīt trīs tādus elementus:

 

 

var default_element;

default_element = $('#default_element').show();

for (var i = 0; i < 3; ++i) {

   $('#place_for_elements').append(default_element);

}

[reiniger]

Atrisinaju problēmu ar pievienot tikai vienu.

<tr class="rate_ firstone">...

un Jquery

<script>
$('#add_RateIdea').click(function(){                                      
$('.firstone').clone().removeClass('firstone').appendTo("#rate_table");    
});
</script>

Šāds mans risinājums, ja es table pievienoju vēlvienu td ar <a onclick='delete()'></a>

Kādā veidā panākt ka šo clona rindiņu (<tr><td>...</tr>) var dzēst ar visiem datiem?

Edited October 11, 2011 by reiniger

[codez]

Pirmkārt jau iemācies lietot jquery delegate un neliec HTML ar js eventiem.

Respektīvi uzliec tabulai, lai uz tās elementiem strādātu events

 

$('#table_id').delegate('.col1','click',function(){
 //sheit darām, ko gribam ar uzspiesto elementu, kuram var piekļūt caur $(this)
});

 

 

Neliels paraugs kā uztaisīt dinamisku tabulu ar jquery: http://jsfiddle.net/MNxPk/

Edited October 11, 2011 by codez

[reiniger]

Paldies lieta atrisināta.