CODEWITHSUNDEEP
jquery
Kuzzy
Kuzzy

Reputation: 640

How to add unique ID to dynamically generated inputs?

Basic question; I have this code:

var partipiansRow = '<div class="form-row "><input type="text" id="name" class="textbox" /> <input type="text" class="textbox" id="email" /></div>'

$(".button").live("click", function(){
    $('.form-participants').after(partipiansRow);         
});

It creates unlimited rows with 2 inputs, how can I set them unique IDs? For example:

<div class="form-row "><input type="text" id="name1" class="textbox" /> <input type="text" class="textbox" id="email1" /></div>
<div class="form-row "><input type="text" id="name2" class="textbox" /> <input type="text" class="textbox" id="email2" /></div>
<div class="form-row "><input type="text" id="name3" class="textbox" /> <input type="text" class="textbox" id="email3" /></div>

Thanks.

Upvotes: 1

Views: 7252

Answers (3)

Sanjay Nishad
Sanjay Nishad

Reputation: 1605

We can create dynamic and unique id like 

function createId() {
  return 'xxxx-xxxx-xxxx-xxxx-xxxx-xxxx-xxxx-xxxx'.replace(/x/g, function (c) {
    var r = Math.random() * 16 | 0;
    return r.toString(16);
  });
}

See here Generate dynamic unique id

Upvotes: 0

BBonifield
BBonifield

Reputation: 5003

Use the current time new Date().getTime()

$(".button").live("click", function(){
    var uid           = new Date().getTime(),
        partipiansRow = '<div class="form-row' + uid + '"><input type="text" id="name' + uid + '" class="textbox" /> <input type="text" class="textbox" id="email' + uid + '" /></div>';
    $('.form-participants').after(partipiansRow);         
});

Upvotes: 0

casablanca
casablanca

Reputation: 70701

Use a counter to keep track of the ID:

var nextRowID = 0;

$(".button").live("click", function(){
    var id = ++nextRowID;
    var partipiansRow = '<div class="form-row "><input type="text" id="name' + id + '" class="textbox" /> <input type="text" class="textbox" id="email' + id + '" /></div>';
    $('.form-participants').after(partipiansRow);         
});

Upvotes: 7

Related Questions