Name: You can write better jQuery
Rating: 1.5 (1696 reviews)
Author: nickciolpan

You can write better jQuery

While almost every new article mentioning it, talks about its demise, I’ve decided to write as about one of the most recurrent jQuery bad practices I came across and how to deal with it. Here it is:

Going from this:


$('.multiSelectOne').multiselect({
    buttonClass: 'btn btn-default',
    buttonWidth: '100%',
    ...
});
$('.multiSelectTwo').multiselect({
    buttonClass: 'btn btn-default',
    buttonWidth: '100%',
    nonSelectedText: '---',
    ...
});

To This:

<select class="js-multiselect" 
    data-include-select-all-option="true" 
    data-all-selected-text="All">
    <option></option>
</select>

$('.js-multi-select).each(function () {
    let options = {};

    Object.entries($(this).data())
        .map(property => options[property[0]] = property[1]);

  $(this).multiselect(options);

}

And never go back for adjustments in the script file ever again.