rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-30 22:52:24 +01:00
Code Issues Actions Packages Releases Activity

fix #11787: document stateful button JS

Browse Source
This commit is contained in:
Chris Rebert 2013-12-08 17:42:59 -08:00
parent 1f35b6ec5c
commit ae0d48057e
2 changed files with 22 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs-assets/js/application.js
View File

@ -90,7 +90,7 @@
.popover() .popover()
// button state demo // button state demo
$('#fat-btn') $('#loading-example-btn')
.click(function () { .click(function () {
var btn = $(this) var btn = $(this)
btn.button('loading') btn.button('loading')

24
javascript.html
View File

@ -1334,14 +1334,23 @@ $('#my-alert').bind('closed.bs.alert', function () {
<h4>Stateful</h4> <h4>Stateful</h4>
<p>Add <code>data-loading-text="Loading..."</code> to use a loading state on a button.</p> <p>Add <code>data-loading-text="Loading..."</code> to use a loading state on a button.</p>
<div class="bs-example" style="padding-bottom: 24px;"> <div class="bs-example" style="padding-bottom: 24px;">
<button type="button" id="fat-btn" data-loading-text="Loading..." class="btn btn-primary"> <button type="button" id="loading-example-btn" data-loading-text="Loading..." class="btn btn-primary">
Loading state Loading state
</button> </button>
</div><!-- /example --> </div><!-- /example -->
{% highlight html %} {% highlight html %}
<button type="button" data-loading-text="Loading..." class="btn btn-primary"> <button type="button" id="loading-example-btn" data-loading-text="Loading..." class="btn btn-primary">
Loading state Loading state
</button> </button>
<script>
$('#loading-example-btn').click(function () {
var btn = $(this);
btn.button('loading');
$.ajax(...).always(function () {
btn.button('reset');
});
});
</script>
{% endhighlight %} {% endhighlight %}
<h4>Single toggle</h4> <h4>Single toggle</h4>
@ -1440,7 +1449,16 @@ $('.btn').button()
<p>Sets button state to loading - disables button and swaps text to loading text. Loading text should be defined on the button element using the data attribute <code>data-loading-text</code>. <p>Sets button state to loading - disables button and swaps text to loading text. Loading text should be defined on the button element using the data attribute <code>data-loading-text</code>.
</p> </p>
{% highlight html %} {% highlight html %}
<button type="button" class="btn btn-primary" data-loading-text="loading stuff...">...</button> <button id="loading-example-btn" type="button" class="btn btn-primary" data-loading-text="loading stuff...">...</button>
<script>
$('#loading-example-btn').click(function () {
var btn = $(this);
btn.button('loading');
$.ajax(...).always(function () {
btn.button('reset');
});
});
</script>
{% endhighlight %} {% endhighlight %}
<div class="bs-callout bs-callout-danger"> <div class="bs-callout bs-callout-danger">