Bootstrap Datepicker: Extending Core Component Functionality

Datetime:2016-08-22 22:22:34          Topic: Bootstrap           Share

Even with a powerful set of components, any library can come up short in completeness when it comes to solving every need. This is especially true when providing a rich end-user experience. There's always a unique way to present information to the user or a subtle difference that can make the experience more engaging.

While the talented team that developedBootstrap has indeed provided a lot of functionality in the library, extending beyond core web components and controls, there's still room for improvement. With the rise ofopen source development anyone can take the official Bootstrap library source and extend it.

That's just what the Boostrap Datepicker does. Not only does it fill the void of needing a popular datepicker control, it also does it in the Bootstrap style - simple, using only HTML markup via the data api approach.

Setting up a Bootstrap Datepicker control requires adding a reference to the JavaScript library, as well as any optional CSS included in the library. Of course, Bootstrap is required.

Here's how to use the data API for the datepicker:

<div class="input-group date" data-provide="datepicker">
    <input type="text" class="form-control">
    <div class="input-group-addon">
        <span class="glyphicon glyphicon-th"></span>
    </div>
</div>

You can see a full example here: http://codepen.io/technoloG/pen/AXoXdg

URL: https://github.com/eternicode/bootstrap-datepicker





About List