Auto Create Slugs in Croogo with jQuery

I got tired of hand writing slugs for my blog posts, I am used to using the acts_as_sluggable behavior. I thought about implementing the behavior into Croogo but realized this might be better implemented as some simple Javascript. Initially I wrote a simple find and replace function with Javascript that converted spaces to hyphens but realized it didn't take into account special characters or more than one space so I did a quick search on Google and came across the jQuery Slug Plugin. It took me about 2 minutes to download and implement.

All you need to do is download the plugin and place it into your webroot/js directory and then modify a few lines in app/views/nodes/admin_add.ctp. The changes I made are below.

$javascript->link(array('nodes', 'jquery.slug'), false);

Include the jQuery slug plugin at the top of the page.


Set up the plugin and let it know the title field's ID and the class of the slug field.

echo $form->input('title', array('id' => 'title'));
echo $form->input('slug', array('class' => 'permalink'));

Add an ID to the title field and a classname to the slug field. That's about it, hope this saves you some time when you are writing your next article.