]> git.ipfire.org Git - thirdparty/bootstrap.git/commitdiff
update buttons in docs to include type
authorMark Otto <markotto@twitter.com>
Fri, 6 Jul 2012 22:18:56 +0000 (15:18 -0700)
committerMark Otto <markotto@twitter.com>
Fri, 6 Jul 2012 22:18:56 +0000 (15:18 -0700)
docs/base-css.html
docs/javascript.html
docs/templates/pages/base-css.mustache
docs/templates/pages/javascript.mustache

index 2b7c1ec7124a5e8ca78e3bd6099bc2f902c4d1e3..3df5a114bedc51022f4a3b22df20a4f9c4816812 100644 (file)
@@ -1136,13 +1136,13 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
   <form class="bs-docs-example">
     <div class="form-actions">
       <button type="submit" class="btn btn-primary">Save changes</button>
-      <button class="btn">Cancel</button>
+      <button type="button" class="btn">Cancel</button>
     </div>
   </form>
 <pre class="prettyprint linenums">
 &lt;div class="form-actions"&gt;
   &lt;button type="submit" class="btn btn-primary"&gt;Save changes&lt;/button&gt;
-  &lt;button class="btn"&gt;Cancel&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Cancel&lt;/button&gt;
 &lt;/div&gt;
 </pre>
 
@@ -1263,37 +1263,37 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
     </thead>
     <tbody>
       <tr>
-        <td><button class="btn" href="#">Default</button></td>
+        <td><button type="button" class="btn">Default</button></td>
         <td><code>btn</code></td>
         <td>Standard gray button with gradient</td>
       </tr>
       <tr>
-        <td><button class="btn btn-primary" href="#">Primary</button></td>
+        <td><button type="button" class="btn btn-primary">Primary</button></td>
         <td><code>btn btn-primary</code></td>
         <td>Provides extra visual weight and identifies the primary action in a set of buttons</td>
       </tr>
       <tr>
-        <td><button class="btn btn-info" href="#">Info</button></td>
+        <td><button type="button" class="btn btn-info">Info</button></td>
         <td><code>btn btn-info</code></td>
         <td>Used as an alternative to the default styles</td>
       </tr>
       <tr>
-        <td><button class="btn btn-success" href="#">Success</button></td>
+        <td><button type="button" class="btn btn-success">Success</button></td>
         <td><code>btn btn-success</code></td>
         <td>Indicates a successful or positive action</td>
       </tr>
       <tr>
-        <td><button class="btn btn-warning" href="#">Warning</button></td>
+        <td><button type="button" class="btn btn-warning">Warning</button></td>
         <td><code>btn btn-warning</code></td>
         <td>Indicates caution should be taken with this action</td>
       </tr>
       <tr>
-        <td><button class="btn btn-danger" href="#">Danger</button></td>
+        <td><button type="button" class="btn btn-danger">Danger</button></td>
         <td><code>btn btn-danger</code></td>
         <td>Indicates a dangerous or potentially negative action</td>
       </tr>
       <tr>
-        <td><button class="btn btn-inverse" href="#">Inverse</button></td>
+        <td><button type="button" class="btn btn-inverse">Inverse</button></td>
         <td><code>btn btn-inverse</code></td>
         <td>Alternate dark gray button, not tied to a semantic action or use</td>
       </tr>
@@ -1310,16 +1310,16 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
   <h2>Button sizes</h2>
   <p>Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.</p>
   <p>
-    <button class="btn btn-large btn-primary">Primary action</button>
-    <button class="btn btn-large">Action</button>
+    <button type="button" class="btn btn-large btn-primary">Primary action</button>
+    <button type="button" class="btn btn-large">Action</button>
   </p>
   <p>
-    <button class="btn btn-small btn-primary">Primary action</button>
-    <button class="btn btn-small">Action</button>
+    <button type="button" class="btn btn-small btn-primary">Primary action</button>
+    <button type="button" class="btn btn-small">Action</button>
   </p>
   <p>
-    <button class="btn btn-mini btn-primary">Primary action</button>
-    <button class="btn btn-mini">Action</button>
+    <button type="button" class="btn btn-mini btn-primary">Primary action</button>
+    <button type="button" class="btn btn-mini">Action</button>
   </p>
 
 
@@ -1347,12 +1347,12 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
   <h3>Button element</h3>
   <p>Add the <code>disabled</code> attribute to <code>&lt;button&gt;</code> buttons.</p>
   <p class="bs-docs-example">
-    <button class="btn btn-large btn-primary disabled" disabled="disabled">Primary button</button>
-    <button class="btn btn-large" disabled>Button</button>
+    <button type="button" class="btn btn-large btn-primary disabled" disabled="disabled">Primary button</button>
+    <button type="button" class="btn btn-large" disabled>Button</button>
   </p>
 <pre class="prettyprint linenums">
-&lt;button class="btn btn-large btn-primary disabled" disabled="disabled"&gt;Primary button&lt;/button&gt;
-&lt;button class="btn btn-large" disabled&gt;Button&lt;/button&gt;
+&lt;button type="button" class="btn btn-large btn-primary disabled" disabled="disabled"&gt;Primary button&lt;/button&gt;
+&lt;button type="button" class="btn btn-large" disabled&gt;Button&lt;/button&gt;
 </pre>
 
 
index 7fb1448ec020a30609817e59ad2d02cfa1004f52..1679c0e7fd963514c3d8f8b84f3140f63d3430c4 100644 (file)
@@ -1086,37 +1086,37 @@ $('#my-alert').bind('closed', function () {
   <h4>Stateful</h4>
   <p>Add data-loading-text="Loading..." to use a loading state on a button.</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
-    <button id="fat-btn" data-loading-text="loading..." class="btn btn-primary">
+    <button type="button" id="fat-btn" data-loading-text="loading..." class="btn btn-primary">
       Loading state
     </button>
   </div>
 <pre class="prettyprint linenums">
-&lt;button class="btn btn-primary" data-loading-text="Loading..."&gt;Loading state&lt;/button&gt;
+&lt;button type="button" class="btn btn-primary" data-loading-text="Loading..."&gt;Loading state&lt;/button&gt;
 </pre>
 
   <h4>Single toggle</h4>
   <p>Add data-toggle="button" to activate toggling on a single button.</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
-    <button class="btn btn-primary" data-toggle="button">Single Toggle</button>
+    <button type="button" class="btn btn-primary" data-toggle="button">Single Toggle</button>
   </div>
 <pre class="prettyprint linenums">
-&lt;button class="btn" data-toggle="button"&gt;Single Toggle&lt;/button&gt;
+&lt;button type="button" class="btn" data-toggle="button"&gt;Single Toggle&lt;/button&gt;
 </pre>
 
   <h4>Checkbox</h4>
   <p>Add data-toggle="buttons-checkbox" for checkbox style toggling on btn-group.</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
     <div class="btn-group" data-toggle="buttons-checkbox">
-      <button class="btn btn-primary">Left</button>
-      <button class="btn btn-primary">Middle</button>
-      <button class="btn btn-primary">Right</button>
+      <button type="button" class="btn btn-primary">Left</button>
+      <button type="button" class="btn btn-primary">Middle</button>
+      <button type="button" class="btn btn-primary">Right</button>
     </div>
   </div>
 <pre class="prettyprint linenums">
 &lt;div class="btn-group" data-toggle="buttons-checkbox"&gt;
-  &lt;button class="btn"&gt;Left&lt;/button&gt;
-  &lt;button class="btn"&gt;Middle&lt;/button&gt;
-  &lt;button class="btn"&gt;Right&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Left&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Middle&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Right&lt;/button&gt;
 &lt;/div&gt;
 </pre>
 
@@ -1124,16 +1124,16 @@ $('#my-alert').bind('closed', function () {
   <p>Add data-toggle="buttons-radio" for radio style toggling on btn-group.</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
     <div class="btn-group" data-toggle="buttons-radio">
-      <button class="btn btn-primary">Left</button>
-      <button class="btn btn-primary">Middle</button>
-      <button class="btn btn-primary">Right</button>
+      <button type="button" class="btn btn-primary">Left</button>
+      <button type="button" class="btn btn-primary">Middle</button>
+      <button type="button" class="btn btn-primary">Right</button>
     </div>
   </div>
 <pre class="prettyprint linenums">
 &lt;div class="btn-group" data-toggle="buttons-radio"&gt;
-  &lt;button class="btn"&gt;Left&lt;/button&gt;
-  &lt;button class="btn"&gt;Middle&lt;/button&gt;
-  &lt;button class="btn"&gt;Right&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Left&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Middle&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Right&lt;/button&gt;
 &lt;/div&gt;
 </pre>
 
@@ -1158,11 +1158,11 @@ $('#my-alert').bind('closed', function () {
     <strong>Heads up!</strong>
     You can enable auto toggling of a button by using the <code>data-toggle</code> attribute.
   </div>
-  <pre class="prettyprint linenums">&lt;button class="btn" data-toggle="button" &gt;…&lt;/button&gt;</pre>
+  <pre class="prettyprint linenums">&lt;button type="button" class="btn" data-toggle="button" &gt;…&lt;/button&gt;</pre>
   <h4>$().button('loading')</h4>
   <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>
-  <pre class="prettyprint linenums">&lt;button class="btn" data-loading-text="loading stuff..." &gt;...&lt;/button&gt;</pre>
+  <pre class="prettyprint linenums">&lt;button type="button" class="btn" data-loading-text="loading stuff..." &gt;...&lt;/button&gt;</pre>
   <div class="alert alert-info">
     <strong>Heads up!</strong>
     <a href="https://github.com/twitter/bootstrap/issues/793">Firefox persists the disabled state across page loads</a>. A workaround for this is to use <code>autocomplete="off"</code>.
@@ -1171,7 +1171,7 @@ $('#my-alert').bind('closed', function () {
   <p>Resets button state - swaps text to original text.</p>
   <h4>$().button(string)</h4>
   <p>Resets button state - swaps text to any data defined text state.</p>
-<pre class="prettyprint linenums">&lt;button class="btn" data-complete-text="finished!" &gt;...&lt;/button&gt;
+<pre class="prettyprint linenums">&lt;button type="button" class="btn" data-complete-text="finished!" &gt;...&lt;/button&gt;
 &lt;script&gt;
   $('.btn').button('complete')
 &lt;/script&gt;</pre>
@@ -1234,7 +1234,7 @@ $('#my-alert').bind('closed', function () {
     </div>
   </div>
 <pre class="prettyprint linenums">
-&lt;button class="btn btn-danger" data-toggle="collapse" data-target="#demo"&gt;
+&lt;button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#demo"&gt;
   simple collapsible
 &lt;/button&gt;
 
index 9b79c3d9c5e1000ebaf54117cb3d46074eebf51d..5435689bde1c9e8a0a1f8af9975523e102e90106 100644 (file)
   <form class="bs-docs-example">
     <div class="form-actions">
       <button type="submit" class="btn btn-primary">{{_i}}Save changes{{/i}}</button>
-      <button class="btn">{{_i}}Cancel{{/i}}</button>
+      <button type="button" class="btn">{{_i}}Cancel{{/i}}</button>
     </div>
   </form>
 <pre class="prettyprint linenums">
 &lt;div class="form-actions"&gt;
   &lt;button type="submit" class="btn btn-primary"&gt;{{_i}}Save changes{{/i}}&lt;/button&gt;
-  &lt;button class="btn"&gt;{{_i}}Cancel{{/i}}&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;{{_i}}Cancel{{/i}}&lt;/button&gt;
 &lt;/div&gt;
 </pre>
 
     </thead>
     <tbody>
       <tr>
-        <td><button class="btn" href="#">{{_i}}Default{{/i}}</button></td>
+        <td><button type="button" class="btn">{{_i}}Default{{/i}}</button></td>
         <td><code>btn</code></td>
         <td>{{_i}}Standard gray button with gradient{{/i}}</td>
       </tr>
       <tr>
-        <td><button class="btn btn-primary" href="#">{{_i}}Primary{{/i}}</button></td>
+        <td><button type="button" class="btn btn-primary">{{_i}}Primary{{/i}}</button></td>
         <td><code>btn btn-primary</code></td>
         <td>{{_i}}Provides extra visual weight and identifies the primary action in a set of buttons{{/i}}</td>
       </tr>
       <tr>
-        <td><button class="btn btn-info" href="#">{{_i}}Info{{/i}}</button></td>
+        <td><button type="button" class="btn btn-info">{{_i}}Info{{/i}}</button></td>
         <td><code>btn btn-info</code></td>
         <td>{{_i}}Used as an alternative to the default styles{{/i}}</td>
       </tr>
       <tr>
-        <td><button class="btn btn-success" href="#">{{_i}}Success{{/i}}</button></td>
+        <td><button type="button" class="btn btn-success">{{_i}}Success{{/i}}</button></td>
         <td><code>btn btn-success</code></td>
         <td>{{_i}}Indicates a successful or positive action{{/i}}</td>
       </tr>
       <tr>
-        <td><button class="btn btn-warning" href="#">{{_i}}Warning{{/i}}</button></td>
+        <td><button type="button" class="btn btn-warning">{{_i}}Warning{{/i}}</button></td>
         <td><code>btn btn-warning</code></td>
         <td>{{_i}}Indicates caution should be taken with this action{{/i}}</td>
       </tr>
       <tr>
-        <td><button class="btn btn-danger" href="#">{{_i}}Danger{{/i}}</button></td>
+        <td><button type="button" class="btn btn-danger">{{_i}}Danger{{/i}}</button></td>
         <td><code>btn btn-danger</code></td>
         <td>{{_i}}Indicates a dangerous or potentially negative action{{/i}}</td>
       </tr>
       <tr>
-        <td><button class="btn btn-inverse" href="#">{{_i}}Inverse{{/i}}</button></td>
+        <td><button type="button" class="btn btn-inverse">{{_i}}Inverse{{/i}}</button></td>
         <td><code>btn btn-inverse</code></td>
         <td>{{_i}}Alternate dark gray button, not tied to a semantic action or use{{/i}}</td>
       </tr>
   <h2>{{_i}}Button sizes{{/i}}</h2>
   <p>{{_i}}Fancy larger or smaller buttons? Add <code>.btn-large</code>, <code>.btn-small</code>, or <code>.btn-mini</code> for two additional sizes.{{/i}}</p>
   <p>
-    <button class="btn btn-large btn-primary">{{_i}}Primary action{{/i}}</button>
-    <button class="btn btn-large">{{_i}}Action{{/i}}</button>
+    <button type="button" class="btn btn-large btn-primary">{{_i}}Primary action{{/i}}</button>
+    <button type="button" class="btn btn-large">{{_i}}Action{{/i}}</button>
   </p>
   <p>
-    <button class="btn btn-small btn-primary">{{_i}}Primary action{{/i}}</button>
-    <button class="btn btn-small">{{_i}}Action{{/i}}</button>
+    <button type="button" class="btn btn-small btn-primary">{{_i}}Primary action{{/i}}</button>
+    <button type="button" class="btn btn-small">{{_i}}Action{{/i}}</button>
   </p>
   <p>
-    <button class="btn btn-mini btn-primary">{{_i}}Primary action{{/i}}</button>
-    <button class="btn btn-mini">{{_i}}Action{{/i}}</button>
+    <button type="button" class="btn btn-mini btn-primary">{{_i}}Primary action{{/i}}</button>
+    <button type="button" class="btn btn-mini">{{_i}}Action{{/i}}</button>
   </p>
 
 
   <h3>Button element</h3>
   <p>{{_i}}Add the <code>disabled</code> attribute to <code>&lt;button&gt;</code> buttons.{{/i}}</p>
   <p class="bs-docs-example">
-    <button class="btn btn-large btn-primary disabled" disabled="disabled">{{_i}}Primary button{{/i}}</button>
-    <button class="btn btn-large" disabled>{{_i}}Button{{/i}}</button>
+    <button type="button" class="btn btn-large btn-primary disabled" disabled="disabled">{{_i}}Primary button{{/i}}</button>
+    <button type="button" class="btn btn-large" disabled>{{_i}}Button{{/i}}</button>
   </p>
 <pre class="prettyprint linenums">
-&lt;button class="btn btn-large btn-primary disabled" disabled="disabled"&gt;{{_i}}Primary button{{/i}}&lt;/button&gt;
-&lt;button class="btn btn-large" disabled&gt;{{_i}}Button{{/i}}&lt;/button&gt;
+&lt;button type="button" class="btn btn-large btn-primary disabled" disabled="disabled"&gt;{{_i}}Primary button{{/i}}&lt;/button&gt;
+&lt;button type="button" class="btn btn-large" disabled&gt;{{_i}}Button{{/i}}&lt;/button&gt;
 </pre>
 
 
index a73917f5e3105eb57971c947de3b1bb5a64af56a..6f51417fa07c308a323b0bb52250da92633c14f1 100644 (file)
@@ -1011,37 +1011,37 @@ $('#my-alert').bind('closed', function () {
   <h4>{{_i}}Stateful{{/i}}</h4>
   <p>{{_i}}Add data-loading-text="Loading..." to use a loading state on a button.{{/i}}</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
-    <button id="fat-btn" data-loading-text="loading..." class="btn btn-primary">
+    <button type="button" id="fat-btn" data-loading-text="loading..." class="btn btn-primary">
       {{_i}}Loading state{{/i}}
     </button>
   </div>{{! /example }}
 <pre class="prettyprint linenums">
-&lt;button class="btn btn-primary" data-loading-text="Loading..."&gt;Loading state&lt;/button&gt;
+&lt;button type="button" class="btn btn-primary" data-loading-text="Loading..."&gt;Loading state&lt;/button&gt;
 </pre>
 
   <h4>{{_i}}Single toggle{{/i}}</h4>
   <p>{{_i}}Add data-toggle="button" to activate toggling on a single button.{{/i}}</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
-    <button class="btn btn-primary" data-toggle="button">{{_i}}Single Toggle{{/i}}</button>
+    <button type="button" class="btn btn-primary" data-toggle="button">{{_i}}Single Toggle{{/i}}</button>
   </div>{{! /example }}
 <pre class="prettyprint linenums">
-&lt;button class="btn" data-toggle="button"&gt;Single Toggle&lt;/button&gt;
+&lt;button type="button" class="btn" data-toggle="button"&gt;Single Toggle&lt;/button&gt;
 </pre>
 
   <h4>{{_i}}Checkbox{{/i}}</h4>
   <p>{{_i}}Add data-toggle="buttons-checkbox" for checkbox style toggling on btn-group.{{/i}}</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
     <div class="btn-group" data-toggle="buttons-checkbox">
-      <button class="btn btn-primary">{{_i}}Left{{/i}}</button>
-      <button class="btn btn-primary">{{_i}}Middle{{/i}}</button>
-      <button class="btn btn-primary">{{_i}}Right{{/i}}</button>
+      <button type="button" class="btn btn-primary">{{_i}}Left{{/i}}</button>
+      <button type="button" class="btn btn-primary">{{_i}}Middle{{/i}}</button>
+      <button type="button" class="btn btn-primary">{{_i}}Right{{/i}}</button>
     </div>
   </div>{{! /example }}
 <pre class="prettyprint linenums">
 &lt;div class="btn-group" data-toggle="buttons-checkbox"&gt;
-  &lt;button class="btn"&gt;Left&lt;/button&gt;
-  &lt;button class="btn"&gt;Middle&lt;/button&gt;
-  &lt;button class="btn"&gt;Right&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Left&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Middle&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Right&lt;/button&gt;
 &lt;/div&gt;
 </pre>
 
@@ -1049,16 +1049,16 @@ $('#my-alert').bind('closed', function () {
   <p>{{_i}}Add data-toggle="buttons-radio" for radio style toggling on btn-group.{{/i}}</p>
   <div class="bs-docs-example" style="padding-bottom: 24px;">
     <div class="btn-group" data-toggle="buttons-radio">
-      <button class="btn btn-primary">{{_i}}Left{{/i}}</button>
-      <button class="btn btn-primary">{{_i}}Middle{{/i}}</button>
-      <button class="btn btn-primary">{{_i}}Right{{/i}}</button>
+      <button type="button" class="btn btn-primary">{{_i}}Left{{/i}}</button>
+      <button type="button" class="btn btn-primary">{{_i}}Middle{{/i}}</button>
+      <button type="button" class="btn btn-primary">{{_i}}Right{{/i}}</button>
     </div>
   </div>{{! /example }}
 <pre class="prettyprint linenums">
 &lt;div class="btn-group" data-toggle="buttons-radio"&gt;
-  &lt;button class="btn"&gt;Left&lt;/button&gt;
-  &lt;button class="btn"&gt;Middle&lt;/button&gt;
-  &lt;button class="btn"&gt;Right&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Left&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Middle&lt;/button&gt;
+  &lt;button type="button" class="btn"&gt;Right&lt;/button&gt;
 &lt;/div&gt;
 </pre>
 
@@ -1083,11 +1083,11 @@ $('#my-alert').bind('closed', function () {
     <strong>{{_i}}Heads up!{{/i}}</strong>
     {{_i}}You can enable auto toggling of a button by using the <code>data-toggle</code> attribute.{{/i}}
   </div>
-  <pre class="prettyprint linenums">&lt;button class="btn" data-toggle="button" &gt;…&lt;/button&gt;</pre>
+  <pre class="prettyprint linenums">&lt;button type="button" class="btn" data-toggle="button" &gt;…&lt;/button&gt;</pre>
   <h4>$().button('loading')</h4>
   <p>{{_i}}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>.{{/i}}
   </p>
-  <pre class="prettyprint linenums">&lt;button class="btn" data-loading-text="loading stuff..." &gt;...&lt;/button&gt;</pre>
+  <pre class="prettyprint linenums">&lt;button type="button" class="btn" data-loading-text="loading stuff..." &gt;...&lt;/button&gt;</pre>
   <div class="alert alert-info">
     <strong>{{_i}}Heads up!{{/i}}</strong>
     {{_i}}<a href="https://github.com/twitter/bootstrap/issues/793">Firefox persists the disabled state across page loads</a>. A workaround for this is to use <code>autocomplete="off"</code>.{{/i}}
@@ -1096,7 +1096,7 @@ $('#my-alert').bind('closed', function () {
   <p>{{_i}}Resets button state - swaps text to original text.{{/i}}</p>
   <h4>$().button(string)</h4>
   <p>{{_i}}Resets button state - swaps text to any data defined text state.{{/i}}</p>
-<pre class="prettyprint linenums">&lt;button class="btn" data-complete-text="finished!" &gt;...&lt;/button&gt;
+<pre class="prettyprint linenums">&lt;button type="button" class="btn" data-complete-text="finished!" &gt;...&lt;/button&gt;
 &lt;script&gt;
   $('.btn').button('complete')
 &lt;/script&gt;</pre>
@@ -1159,7 +1159,7 @@ $('#my-alert').bind('closed', function () {
     </div>
   </div>{{! /example }}
 <pre class="prettyprint linenums">
-&lt;button class="btn btn-danger" data-toggle="collapse" data-target="#demo"&gt;
+&lt;button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#demo"&gt;
   {{_i}}simple collapsible{{/i}}
 &lt;/button&gt;