JavaScript

This simple script converts a text string into a valid URL slug. It mixes jQuery with standard JavaScript, and can be easily adapted to pure JS. <!-- Example input element --> <input id="controlId" type="text" /> // Handles typing $(document).ready(function () { // If the Title is specified, avoid overwrite if ($('#controlId').val().length === 0) { $('#controlId').on('keypress', function () { $('#controlId').val(slugify($('#controlId').val().toLowerCase())); }); } }); // Replacements function slugify(text) { text = text.replace(/[^-a-zA-Z0-9,&\s]+/g, ''); text = text.replace(/-/g, '_'); text = text.replace(/\s/g, '-'); return text; } Note (2025): For modern projects you may also want to normalize accents (é → e), trim repeated separators, and prefer input event instead of keypress. This post keeps the original 2010 logic. ...

Note (2025): This article was originally written in 2009. The example code (inline onclick, manual style.display changes) reflects practices of that era. Modern JavaScript uses event listeners, unobtrusive DOM manipulation, and CSS transitions. The post is kept here as an archive and for historical interest. In almost all web applications comes the moment when it becomes necessary to show some notifications to the user. A common practice in the past, even when elegance was unimportant and web pages didn’t show much dynamic behavior, was the use of the method alert() from JavaScript. ...