End Your If

Category: JavaScript

  • Organizing data with the jQuery Sortable plugin

    Have you ever written some code that lets a user change the display order of something – articles, photos, widgets, etc…? You know the one, either you have the up and down arrows or go old school and let them enter a numerical value. By implementing the jQuery UI Sortable plugin aka sortablejs jquery, you will never have to write such a poor system again!

    The jQuery UI Sortable allows for many different types of data to be sorted. It can be a list of items (horizontal or vertical), a table, a bunch of pictures – the sky truly is the limit. In this example, I will explore creating a photo gallery that allows the user to sort the display order of the photos. If you wish to see some demos, check out the jQuery Sortable plugin demos on their website.
    (more…)

  • Transitioning AJAX Content into view with jQuery $.animate()

    As a user of the Internet, I enjoy slick looking features that help make my experience look cool and seem fast or seamless. A nice trick to include this type of functionality is to perform a transition of new content using jQuery’s $.animate() function.

    (more…)

  • jQuery: Splitting an unordered list into multiple columns

    I was recently answering some questions on Stackoverflow and an intriguing question came up. How do I split an unordered list into a multiple lists to turn them into columns? Using a combination of a JavaScript array and jQuery, I will leverage splice, append, html and a common for loop.

    (more…)

  • jQuery: Padding a Variable or String with a Specific Character

    Every so often you will receive data from a database or potentially user input, but a specific number of characters might be required to format or display the data properly. As an example, you may wish to ensure that a number less than 9 is prefixed with a 0 where numbers that are 10 or more do not need the padding. By extending jQuery, two functions can be created to either prefix or postfix a specific value to a DOM element using a jQuery selector with a JavaScript array.

    To start, here is an example of the starting input and the ending output:

    (more…)

  • Deep clone an object with JavaScript

    To copy/clone an object using JavaScript, you will want to leverage the JSON.parse function in combination with the JSON.stringify function.

    (more…)