DEV Community

loading...
Graffino

You can write better jQuery

Nick Ciolpan
I have extensive experience as a full stack developer, managing clients and building state of the art platforms.
・1 min read

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.

Discussion (0)