ansaurus

Question

Answer 1

A:

EDIT: based on your comment and assuming that this is the element that is cloned.

 $(this).clone()
        .attr( 'id', this.id + '_' + new_id )
        .attr( 'name', this.name + '_' + new_id )
        .val( 'test' )
        .appendTo('#someElement');

Full Example

 <script type="text/javascript">
    var new_id = 0;
    $(document).ready( function() {
       $('#container > input[type=button]').click( function() {
            var oldinp = $('input#inp')[0];
            var newinp = $(oldinp).clone()
                                  .attr('id',oldinp.id + new_id )
                                  .attr('name',oldinp.name + new_id )
                                  .val('test')
                                  .appendTo($('#container'));
            $('#container').append('<br>');
            new_id++;
        });
     });
 </script>


 <div id="container">
 <input type="button" value="Clone" /><br/>
 <input id="inp" name="inp" type="text" value="hmmm" /><br/>
 </div>

tvanfosson 2009-04-22 21:26:57

Unfortunately, that does not work as well.

schneck 2009-04-22 21:28:56

@TStamper: yes, i understood, but this does not work.@tvanfosson: Changing the value before the id does not work here, because the form element is a clone of another element, so first it has to get a unique id.

schneck 2009-04-22 21:32:33

@schneck -- I've updated my answer with respect to cloning an element.

tvanfosson 2009-04-22 21:44:05

Answer 2

A:

Did you try

$(this).val( 'test' );

instead of

$(this).attr('value', 'test');

Val() is generally easier since the attribute you need to change may be different on different dom elements.

Jay 2009-04-22 21:29:25

Answer 3

A:

What happens when you set all of the attributes in one attr() command like so

$(this).attr({
               id : this.id + '_' + new_id,
               name: this.name + '_' + new_id,
               value: 'test' 
             });

Russ Cam 2009-04-22 21:38:10

Answer 4

+1 A:

I just wrote a quick plugin to run a test using your same snippet and it works fine

$.fn.test = function() {
      return this.each(function(){
        var new_id = 5;
        $(this).attr('id',   this.id + '_' + new_id);
        $(this).attr('name', this.name + '_' + new_id);
        $(this).attr('value', 'test');
      });
    };

$(document).ready(function() {
    $('#field_id').test()
});

<body>
  <div id="container">

  <input type="text" name="field_name" id="field_id" value="meh" />
  </div>
</body>

So I can only presume something else is going on in your code. Can you provide some more details?

Steerpike 2009-04-22 21:38:31

You were right, after half a night of debugging i found that it's not good to mix .html() editing with direct node manipulation... anyway, your code brought me to the solution, thanks a lot.

schneck 2009-04-23 07:19:28

Answer 5

A:

use .val() not attr('value')

Chad Grant 2009-04-23 03:57:23

ansaurus

tags:

views:

answers:

Set new id with jQuery

related questions