2013-05-04 2 views
4

Я пытаюсь сделать динамически дублируется поле с JQuery:JS - JQuery динамически добавлять и удалять поля

HTML, (PHP) код:

<div id="widget_dup"> 
    <p> 

    <textarea class="code" cols="50" rows="5" id="o99_brsa_settings[brsa_dash_wdgt_content]" name="o99_brsa_settings[brsa_dash_wdgt_content]" value="<?php //echo $o99_brsa_options['brsa_dash_wdgt_content']; ?>"/><?php 
         echo $o99_brsa_options['brsa_dash_wdgt_content']; 
         ?></textarea> 
         <label class="description" for="o99_brsa_settings[brsa_dash_wdgt_content]"> 
         </br><?php _e('Content for 1st widget', 'o99-brsa-domain'); ?> 
         </label> 

    </p> 
</div> 
<div id="addScnt">add</div><div id="remScnt">remove</div> 

, ИС был собран из отдельных фрагментов, которые я нашел :

<script type="text/javascript"> 

       //http://jsfiddle.net/obmero99/ZD9Ky/ 

        // <![CDATA[ 

        jQuery(function() { 
          var scntDiv = jQuery('#widget_dup'); 
          var prevDiv = scntDiv.html(); 

          var i = jQuery('#widget_dup p').size() + 1; 

          jQuery('#addScnt').live('click', function() { 

            jQuery(prevDiv).appendTo(scntDiv); 

            i++; 
            //alert (prevDiv); 
            return false; 
          }); 

          jQuery('#remScnt').live('click', function() { 
            if(i > 2) { 
              jQuery(this).parents('p').remove(); 
              i--; 
            } 
            return false; 
          }); 
        }); 

        // ]]> 
       </script> 

проблема заключается в том, что этот код будет дублировать поля в порядке, но без изменения идентификатора, названия и другие атрибуты (ID, NAME, FOR и т. Д.)

Я попытался сделать: jQuery(this).attr('id')+i; и jQuery(this).attr('name')+i;, но он не работает, поскольку я намерен. infact, он вообще не работает. :-)

Как я могу изменить attr() поля, пока теория еще не существует?

По комментариям: скрипку здесь: http://jsfiddle.net/obmerk99/uZuWA/

+1

Вместо использования .html(), используйте .clone(), и вы можете задать атрибуты с .attr(), как вы были пытаются – Ian

ответ

4

Правильное использование установки атрибута является

$(this).attr('id', i); 

Вы должны знать, что лучше использовать это с clone(), как это было предложено Ian!

Демо с .clone

http://jsbin.com/oqalig/1/edit

+3

Вы не устанавливая атрибут здесь но вместо этого получается –

+0

Это лучше;) +1 –

+0

Вы правы, я его отредактировал ... пропущен, запятая вместо «+» – drinchev

Смежные вопросы