Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Change default data-loading-text for bootstrap

Since I'm building a Dutch website I would like to have the loading text on bootstrap buttons in Dutch as well. By default the text is Loading... can I change this default without having to add data-loading-text="Bezig..." in every button?

like image 387
JelteF Avatar asked Jul 08 '14 23:07

JelteF


People also ask

What is the default font-size and line-height of Bootstrap 4?

Bootstrap 4 uses a default font-size of 16px, and its line-height is 1.5. The default font-family is "Helvetica Neue", Helvetica, Arial, sans-serif.

What is the default font-family in Bootstrap?

The default font-family is "Helvetica Neue", Helvetica, Arial, sans-serif. In addition, all <p> elements have margin-top: 0 and margin-bottom: 1rem (16px by default). Bootstrap 4 styles HTML headings ( <h1> to <h6> ) with a bolder font-weight and an increased font-size:

How do I add text to a heading in Bootstrap 4?

In Bootstrap 4 the HTML <small> element is used to create a lighter, secondary text in any heading: Bootstrap 4 will style the HTML <mark> element with a yellow background color and some padding: Use the mark element to highlight text. Bootstrap 4 will style the HTML <abbr> element with a dotted border bottom:

How to disable the data attribute API in Bootstrap?

This is Bootstrap's first class API and should be your first consideration when using a plugin. That said, in some situations it may be desirable to turn this functionality off. Therefore, we also provide the ability to disable the data attribute API by unbinding all events on the body namespaced with `'data-api'`.


2 Answers

You can 'initialize' your buttons with the data attribute when you load the page using standard jQuery:

$('button').data('loading-text', 'Bezig...');

OR, you can set the options for the button component like you would other components in Bootstrap:

$('button').button({loadingText: 'Bezig...'});

DEMO

like image 76
jme11 Avatar answered Sep 19 '22 11:09

jme11


I use this (after the bootstrap.min.js) to set it globally, it write the loadingText directly in the plugin prop, add this code in the jquery ready function :

$.fn.button.Constructor.DEFAULTS = {
    loadingText: '<i class="fa fa-spin fa-spinner"></i> Chargement…'
}
like image 31
neoteknic Avatar answered Sep 23 '22 11:09

neoteknic