Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Further improvements to the documentation #32

Merged
merged 15 commits into from
Oct 12, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions ajax-extras.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
- [Flash messages](#ajax-flash)
- [Usage example](#usage-example)

When using the AJAX framework, you have the option to specify the **extras** suffix which includes additional StyleSheet and JavaScript files. These features are useful when working with AJAX requests in front-end CMS pages.
When using the AJAX framework, you have the option to specify the **extras** suffix which includes additional StyleSheet and JavaScript files. These features are useful when working with AJAX requests in frontend CMS pages.

```twig
{% framework extras %}
Expand Down Expand Up @@ -43,7 +43,7 @@ In the server side AJAX handler you may throw a [validation exception](../servic
throw new ValidationException(['name' => 'You must give a name!']);
}

> **Note**: You can also pass an instance of the [validation service](../services/validation) as the first argument of the exception.
> **NOTE**: You can also pass an instance of the [validation service](../services/validation) as the first argument of the exception.

<a name="error-messages"></a>
### Displaying error messages
Expand Down
4 changes: 2 additions & 2 deletions ajax-handlers.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ If two components register the same handler name, it is advised to prefix the ha

<button data-request="mycomponent::onSubmitContactForm">Go</button>

You may want to use the [`__SELF__`](https://wintercms.com/docs/plugin/components#referencing-self) reference variable instead of the hard coded alias in case the user changes the component alias used on the page.
You may want to use the [`__SELF__`](../plugin/components#referencing-self) reference variable instead of the hard coded alias in case the user changes the component alias used on the page.

<form data-request="{{ __SELF__ }}::onCalculate" data-request-update="'{{ __SELF__ }}::calcresult': '#result'">

Expand Down Expand Up @@ -92,7 +92,7 @@ You may throw an [AJAX exception](../services/error-log#ajax-exception) using th
'questionsNeeded' => 2
]);

> **Note**: When throwing this exception type [partials will be updated](../ajax/update-partials) as normal.
> **NOTE**: When throwing this exception type [partials will be updated](../ajax/update-partials) as normal.

<a name="before-handler"></a>
## Running code before handlers
Expand Down
8 changes: 4 additions & 4 deletions ajax-introduction.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,14 @@
<a name="introduction"></a>
## Introduction

Winter includes a framework that brings a full suite of AJAX capabilities which allow you to load data from the server without a browser page refresh. The same library can be used in [CMS themes](../cms/themes) and anywhere in the [back-end administration area](../backend/controllers-ajax#ajax).
Winter includes a framework that brings a full suite of AJAX capabilities which allow you to load data from the server without a browser page refresh. The same library can be used in [CMS themes](../cms/themes) and anywhere in the [backend administration area](../backend/controllers-ajax#ajax).

The AJAX framework comes in two flavors, you may either use [the JavaScript API](../ajax/javascript-api) or [the data attributes API](../ajax/attributes-api). The data attributes API doesn't require any JavaScript knowledge to use AJAX with Winter.

<a name="framework-script"></a>
## Including the framework

The AJAX framework is optional in your [CMS theme](../cms/themes), to use the library you should include it by placing the `{% framework %}` tag anywhere inside your [page](../cms/pages) or [layout](../cms/layouts). This adds a reference to the Winter front-end JavaScript library. The library requires jQuery so it should be loaded first, for example:
The AJAX framework is optional in your [CMS theme](../cms/themes), to use the library you should include it by placing the `{% framework %}` tag anywhere inside your [page](../cms/pages) or [layout](../cms/layouts). This adds a reference to the Winter frontend JavaScript library. The library requires jQuery so it should be loaded first, for example:

```
<script src="{{ 'assets/javascript/jquery.js' | theme }}"></script>
Expand All @@ -41,7 +41,7 @@ A page can issue an AJAX request either prompted by data attributes or by using
5. The server sends the response, containing the rendered partials markup.
6. The client-side framework updates page elements with the partials data received from the server.

> **Note**: Depending on the page context a [CMS partial](../cms/partials) or [backend partial](../backend/views-partials) view will be rendered.
> **NOTE**: Depending on the page context a [CMS partial](../cms/partials) or [backend partial](../backend/views-partials) view will be rendered.

<a name="usage-example"></a>
## Usage example
Expand All @@ -62,7 +62,7 @@ Below is a simple example that uses the data attributes API to define an AJAX en
<!-- Result container -->
<div id="myDiv"></div>

> **Note**: The form data for `value1` and `value2` are automatically sent with the AJAX request.
> **NOTE**: The form data for `value1` and `value2` are automatically sent with the AJAX request.

The **mypartial** partial contains markup that reads the `result` variable.

Expand Down
4 changes: 2 additions & 2 deletions ajax-update-partials.md
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@ The following example will update an element on the page with the id **myDiv** u
];
}

> **Note:** The key name must start with an identifier `#` or class `.` character to trigger a content update.
> **NOTE:** The key name must start with an identifier `#` or class `.` character to trigger a content update.

<a name="passing-variables"></a>
## Passing variables to partials
Expand All @@ -96,7 +96,7 @@ Depending on the execution context, an [AJAX event handler](../ajax/handlers) ma

- Use `$this[]` inside a page or layout [PHP section](../cms/themes#php-section).
- Use `$this->page[]` inside a [component class](../plugin/components#ajax-handlers).
- Use `$this->vars[]` in the [back-end area](../backend/controllers-ajax#ajax).
- Use `$this->vars[]` in the [backend area](../backend/controllers-ajax#ajax).

These examples will provide the **result** variable to a partial for each context:

Expand Down
Loading