How can I generate a short unique code number inside a form field input?

Question

Hi I have this script that loads a unique code into a form input field on page load. Only it generates a long value. How can I shorten this value to maybe half the size number of characters.

EXAMPLE CODE IT GENERATES: adf4a039-7c9d-4642-94f2-0569910a4a10

SCRIPT

<script>
$(document).ready(function() {
function invoiceid() {
    var d = new Date().getTime();
    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (d + Math.random()*16)%16 | 0;
        d = Math.floor(d/16);
        return (c=='x' ? r : (r&0x3|0x8)).toString(16);
    });
    return uuid;
};

document.getElementById('invoiceid').onclick = function() {
    document.getElementById('uuid').innerHTML = invoiceid();
};

document.getElementById('uuid').innerHTML = invoiceid();

});

</script>

If you shorten it, how will you know that it's still unique? — belwood, Feb 10 '15 at 01:57

NewToJS · Accepted Answer · 2015-02-10T02:06:22.267

The XXXXX's are being replaced so the more/less X's you have the bigger/smaller the ID will be generated.

function invoiceid() {
    var d = new Date().getTime();
    // Remove some of the X's to generate a smaller ID 
// You can also remove '-' if you don't want the ID formatted in sections
    var uuid = 'xxxx-xxxx4xx'.replace(/[xy]/g, function(c) {
        var r = (d + Math.random()*16)%16 | 0;
        d = Math.floor(d/16);
        return (c=='x' ? r : (r&0x3|0x8)).toString(16);
    });
    document.getElementById('uuid').innerHTML=uuid;
    //return uuid;
}
 window.onload=invoiceid;

<div id="uuid"></div><button onclick="invoiceid()">New ID</button>

Happy coding!

Bitwise Creative · Answer 2 · 2015-02-10T02:07:59.867

The issue I'm struggling with is that simply shortening this breaks the convention of the UUID. However, if you really want to, you could simply substr() it...

var shortId = invoiceid().substr(0, 18);

Note, however, that this increases the chance of a duplicate value. Using this method may require you to check for a previous invoice ID with the same value.

Full code (updated for jQuery):

<script>
$(document).ready(function() {
function invoiceid() {
    var d = new Date().getTime();
    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (d + Math.random()*16)%16 | 0;
        d = Math.floor(d/16);
        return (c=='x' ? r : (r&0x3|0x8)).toString(16);
    });
    return uuid;
};

function shortInvoiceId() {
    return invoiceid().substr(0, 18);
}

$('#invoiceid').on('click', function() {
    $('#uuid').html(shortInvoiceId());
});

$('#uuid').html(shortInvoiceId());

});

</script>

http://jsfiddle.net/to52rrt9/2/

score 1 · Answer 3 · edited May 23 '17 at 11:59

I agree with the previous comments - if it's important for this to be unique, you should stick with a UUID. If you just want to generate random-looking codes, see this answer and related answers for a lot of ways to generate random alphanumerics in JavaScript. For example:

<script>

function randomString(len, charSet) {
    charSet = charSet || 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
    var randomString = '';
    for (var i = 0; i < len; i++) {
        var randomPoz = Math.floor(Math.random() * charSet.length);
        randomString += charSet.substring(randomPoz,randomPoz+1);
    }
    return randomString;
}

$(document).ready(function() {
document.getElementById('invoiceid').onclick = function() {
    // random 5-character string
    document.getElementById('uuid').innerHTML = randomString(5); 
};

document.getElementById('uuid').innerHTML = randomString(5);

});

</script>

How can I generate a short unique code number inside a form field input?

3 Answers3