I would like to use and load your buttons in a lazy manner. All components of the bootstrap are capable of this. Consider modal links. A modal link does not aware of modal capabilities until it is clicked. When the link is clicked, it is gaining a modal behavior. What I would like to do is something like this. This is pretty important for ajax contents and reducing the amount of the javascript codes by utilizing Data Attributes as in your sample. This brings extra markup for initial state but It is not a problem.
Check type ahead example:
$(function () {
$('body').on('focus.typeahead.data-api', '[data-provide="typeahead"]', function (e) {
var $this = $(this)
if ($this.data('typeahead')) return
e.preventDefault()
$this.typeahead($this.data())
})
})
I would like to use and load your buttons in a lazy manner. All components of the bootstrap are capable of this. Consider modal links. A modal link does not aware of modal capabilities until it is clicked. When the link is clicked, it is gaining a modal behavior. What I would like to do is something like this. This is pretty important for ajax contents and reducing the amount of the javascript codes by utilizing Data Attributes as in your sample. This brings extra markup for initial state but It is not a problem.
Check type ahead example: