jQuery Javascript create unique ID for an Element

• Tweet

• Tweet

Hi Guys,

There are time when you want to create a unique ID on the Fly either from your JQuery plugin or your usual JavaScript Code

Here are couple of ways I use without extending the Object class

First method

function uniqID(idlength) {
            var charstoformid = '_0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz'.split('');
            if (! idlength) {
                idlength = Math.floor(Math.random() * charstoformid.length);
            }
            var uniqid = '';
            for (var i = 0; i < length; i++) {
                uniqid += charstoformid[Math.floor(Math.random() * charstoformid.length)];
            }
            // one last step is to check if this ID is already taken by an element before 
            if(jQuery("#"+uniqid).length == 0)
                return uniqid;
            else
                return uniqID(20)
        }

Usage

You can use the above method to return uniq id as shown below

var uniq_id = uniqID(20);

Second method

In second method we will use a counter as shown below

var uniqID = {
   counter:0,
   get:function(prefix) {
       if(!prefix) {
           prefix = "uniqid";
       }
       var id =  prefix+""+uniqID.counter++;
       if(jQuery("#"+id).length == 0)
           return id;
       else
           return uniqID.get()
 
   }
}

Above method use an object with has one property counter and a method get

Usage

Above can be utilized in your code as shown below

var uniq_id = uniqID.get();
// if you want to prefix your ID the do this
var uniq_id = uniqID.get('myprefix')

I have typed above code directly in this post rather than copy pasting

If you find any error in above method or want to suggest any other method please leave your comments.

Cheers,