Skip to content
This repository was archived by the owner on Nov 19, 2024. It is now read-only.

Commit df1f67a

Browse files
committed
Merge master
2 parents 4e67cdd + 856de21 commit df1f67a

File tree

6 files changed

+93
-0
lines changed

6 files changed

+93
-0
lines changed

_data/toc/javascript-developer-guide.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,5 +85,8 @@ pages:
8585
- label: QuickSearch widget
8686
url: /javascript-dev-guide/widgets/widget_quickSearch.html
8787

88+
- label: RedirectUrl widget
89+
url: /javascript-dev-guide/widgets/widget_redirectUrl.html
90+
8891
- label: Tabs widget
8992
url: /javascript-dev-guide/widgets/widget_tabs.html
Loading

guides/v2.1/javascript-dev-guide/widgets/jquery-widgets-about.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ This guide discusses the following widgets:
2121
- [Navigation widget]
2222
- [Prompt widget]
2323
- [QuickSearch widget]
24+
- [RedirectUrl widget]
2425
- [Tabs widget]
2526

2627
{:.bs-callout .bs-callout-info}
@@ -43,5 +44,6 @@ Magento out of the box does not contain jQuery UI styles. Also, it is not recomm
4344
[Navigation widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_navigation.html
4445
[Prompt widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_prompt.html
4546
[QuickSearch widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_quickSearch.html
47+
[RedirectUrl widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_redirectUrl.html
4648
[Tabs widget]: {{page.baseurl}}/javascript-dev-guide/widgets/widget_tabs.html
4749
[jQuery UI 1.9.2]: http://blog.jqueryui.com/2012/11/jquery-ui-1-9-2/
Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
---
2+
group: javascript-developer-guide
3+
subgroup: 3_Widgets
4+
title: RedirectUrl widget
5+
contributor_name: Atwix
6+
contributor_link: https://www.atwix.com/
7+
---
8+
9+
## Overview
10+
11+
The RedirectUrl {% glossarytooltip f0dcf847-ce21-4b88-8b45-83e1cbf08100 %}widget{% endglossarytooltip %} allows redirecting to an URL when an event triggers.
12+
13+
The RedirectUrl widget source is [lib/web/mage/redirect-url.js][].
14+
15+
## Initialize the RedirectUrl widget
16+
17+
For information about how to initialize a widget in a JS component or `.phtml` template, see the [Initialize JavaScript][] topic.
18+
19+
Generally the RedirectUrl widget is instantiated like following:
20+
21+
```javascript
22+
$("#element").redirectUrl({url: 'http://example.com'});
23+
```
24+
25+
Where:
26+
27+
- `#element` is the selector of the element for which RedirectUrl is initialized.
28+
29+
Phtml template file examples using script:
30+
31+
```html
32+
<script>
33+
require([
34+
'jquery',
35+
'redirectUrl'
36+
], function ($) {
37+
'use strict';
38+
39+
$("#element").redirectUrl({url: 'http://example.com'});
40+
});
41+
</script>
42+
```
43+
44+
## Options
45+
46+
The RedirectUrl widget has the following options:
47+
48+
- [event]
49+
- [url]
50+
51+
### `event`
52+
53+
The event of the DOM element for which you want to carry out the redirect.
54+
55+
**Type**: String
56+
57+
**Default value**: `click`
58+
59+
### `url`
60+
61+
The redirect URL.
62+
63+
**Type**: String
64+
65+
**Default value**: `undefined`
66+
67+
## Code sample
68+
69+
The following example shows the button and after clicking on this button you will be redirected to the `http://example.com` URL.
70+
71+
```html
72+
<button class="action primary"
73+
data-mage-init='{"redirectUrl": {"event": "click", "url": "http://example.com"}}'
74+
type="button"
75+
title="Redirect Button">
76+
<span>Redirect Button</span>
77+
</button>
78+
```
79+
80+
## Result
81+
82+
![RedirectUrl Button Example]({{ site.baseurl }}/common/images/widget/redirectUrl-widget-result.png)
83+
84+
<!-- Link Definitions -->
85+
[lib/web/mage/redirect-url.js]: {{ site.mage2bloburl }}/{{ page.guide_version }}/lib/web/mage/redirect-url.js
86+
[Initialize JavaScript]: {{page.baseurl}}/javascript-dev-guide/javascript/js_init.html
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
../../../v2.1/javascript-dev-guide/widgets/widget_redirectUrl.md
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
../../../v2.2/javascript-dev-guide/widgets/widget_redirectUrl.md

0 commit comments

Comments
 (0)