mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-26 14:54:27 +02:00
Code Issues Releases Wiki Activity

Add getOrCreateInstance method in base-component (#33276)

Browse Source 
Co-authored-by: Rohit Sharma <rohit2sharma95@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
GeoSot
2021-06-03 18:53:27 +03:00
committed by GitHub
parent 4a5029ea29
commit c98657b830
39 changed files with 744 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
site/content/docs/5.0/components/alerts.md
View File

@@ -209,6 +209,15 @@ This makes an alert listen for click events on descendant elements which have th
Static method which allows you to get the alert instance associated to a DOM element, you can use it like this: <code>bootstrap.Alert.getInstance(alert)</code>
</td>
</tr>
<tr>
<td>
<code>getOrCreateInstance</code>
</td>
<td>
Static method which returns an alert instance associated to a DOM element or create a new one in case it wasn't initialised.
You can use it like this: <code>bootstrap.Alert.getOrCreateInstance(element)</code>
</td>
</tr>
</tbody>
</table>

17
site/content/docs/5.0/components/buttons.md
View File

@@ -193,6 +193,23 @@ var bsButton = new bootstrap.Button(button)
Destroys an element's button. (Removes stored data on the DOM element)
</td>
</tr>
<tr>
<td>
<code>getInstance</code>
</td>
<td>
Static method which allows you to get the button instance associated to a DOM element, you can use it like this: <code>bootstrap.Button.getInstance(element)</code>
</td>
</tr>
<tr>
<td>
<code>getOrCreateInstance</code>
</td>
<td>
Static method which returns a button instance associated to a DOM element or create a new one in case it wasn't initialised.
You can use it like this: <code>bootstrap.Button.getOrCreateInstance(element)</code>
</td>
</tr>
</tbody>
</table>

17
site/content/docs/5.0/components/carousel.md
View File

@@ -413,8 +413,21 @@ var carousel = new bootstrap.Carousel(myCarousel, {
<td>Destroys an element's carousel. (Removes stored data on the DOM element)</td>
</tr>
<tr>
<td><code>getInstance</code></td>
<td>Static method which allows you to get the carousel instance associated with a DOM element.</td>
<td>
<code>getInstance</code>
</td>
<td>
Static method which allows you to get the carousel instance associated to a DOM element, you can use it like this: <code>bootstrap.Carousel.getInstance(element)</code>
</td>
</tr>
<tr>
<td>
<code>getOrCreateInstance</code>
</td>
<td>
Static method which returns a carousel instance associated to a DOM element or create a new one in case it wasn't initialised.
You can use it like this: <code>bootstrap.Carousel.getOrCreateInstance(element)</code>
</td>
</tr>
</tbody>
</table>

17
site/content/docs/5.0/components/collapse.md
View File

@@ -187,8 +187,21 @@ var bsCollapse = new bootstrap.Collapse(myCollapse, {
<td>Destroys an element's collapse. (Removes stored data on the DOM element)</td>
</tr>
<tr>
<td><code>getInstance</code></td>
<td>Static method which allows you to get the collapse instance associated with a DOM element.</td>
<td>
<code>getInstance</code>
</td>
<td>
Static method which allows you to get the collapse instance associated to a DOM element, you can use it like this: <code>bootstrap.Collapse.getInstance(element)</code>
</td>
</tr>
<tr>
<td>
<code>getOrCreateInstance</code>
</td>
<td>
Static method which returns a collapse instance associated to a DOM element or create a new one in case it wasn't initialised.
You can use it like this: <code>bootstrap.Collapse.getOrCreateInstance(element)</code>
</td>
</tr>
</tbody>
</table>

15
site/content/docs/5.0/components/dropdowns.md
View File

@@ -1136,9 +1136,20 @@ var dropdown = new bootstrap.Dropdown(element, {
</td>
</tr>
<tr>
<td><code>getInstance</code></td>
<td>
Static method which allows you to get the dropdown instance associated with a DOM element.
<code>getInstance</code>
</td>
<td>
Static method which allows you to get the dropdown instance associated to a DOM element, you can use it like this: <code>bootstrap.Dropdown.getInstance(element)</code>
</td>
</tr>
<tr>
<td>
<code>getOrCreateInstance</code>
</td>
<td>
Static method which returns a dropdown instance associated to a DOM element or create a new one in case it wasn't initialised.
You can use it like this: <code>bootstrap.Dropdown.getOrCreateInstance(element)</code>
</td>
</tr>
</tbody>

9
site/content/docs/5.0/components/list-group.md
View File

@@ -484,6 +484,15 @@ var triggerEl = document.querySelector('#trigger')
var tab = bootstrap.Tab.getInstance(triggerEl) // Returns a Bootstrap tab instance
```
#### getOrCreateInstance
*Static* method which allows you to get the tab instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var triggerEl = document.querySelector('#trigger')
var tab = bootstrap.Tab.getOrCreateInstance(triggerEl) // Returns a Bootstrap tab instance
```
### Events
When showing a new tab, the events fire in the following order:

9
site/content/docs/5.0/components/modal.md
View File

@@ -952,6 +952,15 @@ var myModalEl = document.getElementById('myModal')
var modal = bootstrap.Modal.getInstance(myModalEl) // Returns a Bootstrap modal instance
```
#### getOrCreateInstance
*Static* method which allows you to get the modal instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var myModalEl = document.querySelector('#myModal')
var modal = bootstrap.Modal.getOrCreateInstance(myModalEl) // Returns a Bootstrap modal instance
```
### Events
Bootstrap's modal class exposes a few events for hooking into modal functionality. All modal events are fired at the modal itself (i.e. at the `<div class="modal">`).

9
site/content/docs/5.0/components/navs-tabs.md
View File

@@ -624,6 +624,15 @@ var triggerEl = document.querySelector('#trigger')
var tab = bootstrap.Tab.getInstance(triggerEl) // Returns a Bootstrap tab instance
```
#### getOrCreateInstance
*Static* method which allows you to get the tab instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var triggerEl = document.querySelector('#trigger')
var tab = bootstrap.Tab.getOrCreateInstance(triggerEl) // Returns a Bootstrap tab instance
```
### Events
When showing a new tab, the events fire in the following order:

1
site/content/docs/5.0/components/offcanvas.md
View File

@@ -241,6 +241,7 @@ var bsOffcanvas = new bootstrap.Offcanvas(myOffcanvas)
| `show` | Shows an offcanvas element. **Returns to the caller before the offcanvas element has actually been shown** (i.e. before the `shown.bs.offcanvas` event occurs).|
| `hide` | Hides an offcanvas element. **Returns to the caller before the offcanvas element has actually been hidden** (i.e. before the `hidden.bs.offcanvas` event occurs).|
| `getInstance` | *Static* method which allows you to get the offcanvas instance associated with a DOM element |
| `getOrCreateInstance` | *Static* method which allows you to get the offcanvas instance associated with a DOM element, or create a new one in case it wasn't initialised |
{{< /bs-table >}}
### Events

9
site/content/docs/5.0/components/popovers.md
View File

@@ -393,6 +393,15 @@ var exampleTriggerEl = document.getElementById('example')
var popover = bootstrap.Popover.getInstance(exampleTriggerEl) // Returns a Bootstrap popover instance
```
#### getOrCreateInstance
*Static* method which allows you to get the popover instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var exampleTriggerEl = document.getElementById('example')
var popover = bootstrap.Popover.getOrCreateInstance(exampleTriggerEl) // Returns a Bootstrap popover instance
```
### Events
<table class="table">

9
site/content/docs/5.0/components/scrollspy.md
View File

@@ -298,6 +298,15 @@ var scrollSpyContentEl = document.getElementById('content')
var scrollSpy = bootstrap.ScrollSpy.getInstance(scrollSpyContentEl) // Returns a Bootstrap scrollspy instance
```
#### getOrCreateInstance
*Static* method which allows you to get the scrollspy instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var scrollSpyContentEl = document.getElementById('content')
var scrollSpy = bootstrap.ScrollSpy.getOrCreateInstance(scrollSpyContentEl) // Returns a Bootstrap scrollspy instance
```
### Options
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-bs-`, as in `data-bs-offset=""`.

18
site/content/docs/5.0/components/toasts.md
View File

@@ -391,6 +391,24 @@ Hides an element's toast. Your toast will remain on the DOM but won't show anymo
toast.dispose()
```
#### getInstance
*Static* method which allows you to get the scrollspy instance associated with a DOM element
```js
var myToastEl = document.getElementById('myToastEl')
var myToast = bootstrap.Toast.getInstance(myToastEl) // Returns a Bootstrap toast instance
```
#### getOrCreateInstance
*Static* method which allows you to get the scrollspy instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var myToastEl = document.getElementById('myToastEl')
var myToast = bootstrap.Toast.getOrCreateInstance(myToastEl) // Returns a Bootstrap toast instance
```
### Events
<table class="table">

9
site/content/docs/5.0/components/tooltips.md
View File

@@ -417,6 +417,15 @@ var exampleTriggerEl = document.getElementById('example')
var tooltip = bootstrap.Tooltip.getInstance(exampleTriggerEl) // Returns a Bootstrap tooltip instance
```
#### getOrCreateInstance
*Static* method which allows you to get the tooltip instance associated with a DOM element, or create a new one in case it wasn't initialised
```js
var exampleTriggerEl = document.getElementById('example')
var tooltip = bootstrap.Tooltip.getOrCreateInstance(exampleTriggerEl) // Returns a Bootstrap tooltip instance
```
### Events
<table class="table">