Web Dev: Using data-* attributes – Web developer guide | MDN

JavaScript Access

Reading those out in JavaScript is also very simple. You could use getAttribute() to read them but the standard defines a simpler way: a DOMStringMap you can read out via a dataset property:

var article = document.querySelector('#electriccars'),
data = article.dataset;

// data.columns -> "3"
// data.indexnumber -> "12314"
// data.parent -> "cars"

Each property is a string (even if you omit the quotes in the HTML) and can be read and written. In the above case setting article.dataset.columns = 5 would change that attribute.

via Using data-* attributes – Web developer guide | MDN.

JavaScript Tips N Tricks: Learning underscore.js


One of the tools in our SPA toolkit is underscore.js.  It was a new tool that I fell in love with instantly.  It really helps to make javascript code simpler, cleaner, easier to read, and more maintainable. Here is a list of links for learning and reference.

General Knowledge

underscorejs.org
GitHub: Underscore.js
StackOverflow: About underscore.js

Videos

Pluralsight: Underscore.js Fundamentals

Blog Posts

An Introduction to Underscore.js by Dan Wellman
Eloquent JavaScript with Underscore.js by Something Somewhere.
Easy functional programming in JavaScript with Underscore.js — part 1 by Nick Morgan :: Part 2

Books

This book is going on my “to read” list for JavaScript.  I read through the introduction and it appears to have some great information about JavaScript functional programming as well as being a good example of how to utilize underscore.js. Anything with good code samples is key in my world.

JavaScript Tips n Tricks: Writing Decent JavaScript Code

I’ve had a hard time learning JavaScript over the years.  Mainly because I only learn it as I need to use it and most of the code I use is what I find doing a search for a single specific topic.  One of my goals last year was to improve these skills.  A new SPA project at work has helped me quite a bit but I keep looking for better information.  Someone had recommended the book “JavaScript the Good Parts” by Douglas Crockford.  I picked it up, read the intro, paged through it a few times, and promptly forgot I had purchased it.  A few days ago I was looking at Pluralsight to find something new to watch and found out that there was a new course called “JavaScript the Good Parts” out there authored by none other than Mr. Crockford himself.  I watched it and realized that it was the piece I was missing.  Between the book and the course I have finally found both pieces of the puzzle that is JavaScript.  I’ll be watching the course a few times to try to catch more of the nuances of the language that have evaded me.

moment.js Tips n Tricks: Add Business Days

I needed a really quick and dirty way to add business days to a date.  We are currently using moment.js to handle our date functionality.  Here is the script I used:

    public addBusinessDays(date, daysToAdd) {
        var cnt = 0;
        var tmpDate = moment(date);
        while (cnt < daysToAdd) {
            tmpDate = tmpDate.add('days', 1);
            if (tmpDate.weekday() != moment().day("Sunday").weekday() && tmpDate.weekday() != moment().day("Saturday").weekday()) {
                cnt = cnt + 1;
            }
        }

        return tmpDate;
    }

Updated:

Here is another way to handle the same thing that works better for large numbers. Full credit for this code goes to leonardosantos, I am reposting it so that I have a copy.
https://github.com/leonardosantos/momentjs-business/blob/master/momentjs-business.js

/**
 * momentjs-business.js
 * businessDiff (mStartDate)
 * businessAdd (numberOfDays)
 */
(function () {
  var moment;
  moment = (typeof require !== "undefined" && require !== null) &&
           !require.amd ? require("moment") : this.moment;

  moment.fn.businessDiff = function (start) {
    start = moment(start);
    var end = this.clone();
    var start_offset = start.day() - 7;
    var end_offset = end.day();

    var end_sunday = end.clone().subtract('d', end_offset);
    var start_sunday = start.clone().subtract('d', start_offset);
    var weeks = end_sunday.diff(start_sunday, 'days') / 7;

    start_offset = Math.abs(start_offset);
    if(start_offset == 7)
      start_offset = 5;
    else if(start_offset == 1)
      start_offset = 0;
    else
      start_offset -= 2;


    if(end_offset == 6)
      end_offset--;

    return weeks * 5 + start_offset + end_offset;
  };

  moment.fn.businessAdd = function (days) {
    var d = this.clone().add('d', Math.floor(days / 5) * 7);
    var remaining = days % 5;
    while(remaining){
      d.add('d', 1);
      if(d.day() !== 0 && d.day() !== 6)
        remaining--;
    }
    return d;
  };

}).call(this);

JavaScript Tips n Tricks: Has only digits

Sometimes it’s necessary to do validation manually in javascript.  One that I had to do recently was to do a simple check that a value only had digits in it.  It should be obvious but since I had to look it up I figure I will post it so I can reference it in the future.


var notes = $("#txtContactExt").val();
if (/\D/.test(notes))
{
validationText += "*Please use numbers only for Phone Extension.";
}