Skip to main content

A Lesson from WordPress

As much as WordPress is a code disaster, there are still a few good practices and lessons that can be learned from it.  One of those practices that I've come to appreciate is the idea of a "slug", which is basically a URL, DOM ID and database key-friendly field in a table.

So for example, if you have a Products table with a product number, name and description, you may find that none of these fields are appropriate to use as a DOM ID but you may need a DOM ID to do some page automation.  This is a good time for a "slug"!

id   slug      product_number   name               description
--   -------   --------------   ------------       -----------
1    widgetT   PN-409A 1        Widget Thing       A thingy widget.
2    widgetS   PN-409B 5        Widget Stuff       Stuff for a widget.
3    thingyN   TH-655Z ABC      Non-widget Thing   Thing with no widget.

Now we have a unique, DOM-friendly ID that we can use in our HTML:

<a href="#" id="{{ $product->slug }}" onClick="addProduct({{ $product->slug }}">

 <script>
    function addProduct(slug) {
        $('#' + slug).css('color', '#ccc');
    }
</script>

I find this to be a lot cleaner and intutive than:

<a href="#" id="product{{ $product->id }}" onClick="addProduct({{ $product->id }}">

 <script>
    function addProduct(pid) {
        $('#product' + id).css('color', '#ccc');
    }
</script>

If you ever look at the page source, it is handy to have the ID indicate the actual product.

Plus, you can use that slug for more SEO-friendly URLs:

<a href="/product/{{ $product->slug }}">

Result:  http://www.mysite.com/product/widgetT

Comments

Post a Comment

Popular posts from this blog

jQuery noUIslider Pip Label Customization

Recently, I was tasked with creating a slider element for a user to select their credit rating, of which the user can select from among: 'Poor', 'Fair', 'Good', 'Excellent' and 'Not Sure'.  Several problems presented themselves here: A drop-down box would be better, but that's not what the requirements specified. I already have several numeric sliders on my page and I want them all to match. I selected the jQuery noUi Slider library to create the numeric sliders. noUi Slider does not support string values - only numeric values. The "pips" (slider scale/labels) also does not support string values. Since the solution involved shifting my mindset, I wanted to document it here for future reference and maybe to help someone facing the same requirements. Here's my solution: Since there is really no numeric correlation to credit score (especially considering one of the options is "Not Sure"), I will just u...
Post a Comment
Read more

Salesforce Apex: Replacing and/or Removing Apex Classes

Working with code within the constraints of Salesforce's workflow can be a challenge.  First , you have the restriction on changing anything in production.  Second , you have the requirement for 75% or greater unit test coverage.  Third , you have the fact that certain metadata cannot be pushed to production through a changeset (which means the only way to sync record IDs is by re-deploying the development environment from production). Fourth - and this is what I'd like to blog about today - you cannot delete classes from production through the Salesforce UI .  The only way to delete a class from production is to download the class (and its associated metadata file) into the Eclipse IDE (which you have previously set up with the Apex add-on), change the "status" flag to "Deleted", then deploy the changed metadata file to production.  And (here's the kicker)...sometimes it doesn't work because...reasons. So let's start with the workflow of a f...
Post a Comment
Read more

More Laravel Magic - Touches

What is "touches"?  Well, anyone familiar with Linux/Unix is going to be familiar with the concept of "touching" a file.  Touching a file sets the "last modified" timestamp (or creates the file if it doesn't exist).  Knowing when a file was last modified can be very important for version control. Laravel has something similar for its model relations.  For example, lets say there is a club with many members.  When a member joins, leaves or gets a new role in the club, you might contend that the club has changed.  In terms of Laravel, you would want the club table's "updated_at" timestamp to reflect that change.  Enter the "touches" property... To make the magic happen in Laravel, you simply need to define the parent relationship and add it to the touches property like so: <?php class Club extends Model { /** * Touches (touch parent model when this model changes) */ protected $touches = [ ...
Post a Comment
Read more