up.fragment up.reload([element], [options])

JavaScript function

The element or selector that should be reloaded.

If omitted, an element matching a selector in up.fragment.config.mainTargets will be reloaded.

When an Element object is passed, a target selector will be derived.

Additional render options to use when reloading the fragment.

Common options are documented below, but most options for up.render() may be used.

Defaults can be configured in up.fragment.config.reloadOptions and up.fragment.config.renderOptions.

Whether the reloading constitutes a user navigation.

The URL from which to reload the fragment.

Defaults to the URL from which the fragment was originally loaded.

The HTTP method to use for the request.

Common values are 'get', 'post', 'put', 'patch' and 'delete'. The value is case-insensitive.

Additional parameters that should be sent as the request's query string or payload.

When making a GET request to a URL with a query string, the given { params } will be added to the query parameters.

An object with additional request headers.

Unpoly will by default send a number of custom request headers. For example, the X-Up-Target header includes the targeted CSS selector. See up.protocol for details.

Whether to abort existing requests before rendering.

See aborting requests for details and a list of options.

Whether the request may be aborted by other requests targeting the same fragments or layer.

See Aborting rules in layers.

Whether this request will load in the background.

Background requests are deprioritized and won't show the progress bar. See Background requests.

The number of milliseconds after which this request can cause an up:network:late event and show the progress bar.

To prevent the event and progress bar, pass { lateDelay: false }.

Defaults to up.network.config.lateDelay.

The number of milliseconds after which this request fails with a timeout.

Defaults to up.network.config.timeout.

Whether to render error responses differently.

Error responses will be rendered using options prefixed with fail, e.g. { failTarget }.

By default any HTTP status code other than 2xx or 304 is considered an error response. Pass { fail: false } to handle any response as successful, even with a 4xx or 5xx status code.

Whether to restore the fragment from the cache.

By default the cache is ignored and a new HTTP request is sent. Pass { cache: true } to restore the fragment from the cache.

Whether to reload the targeted fragment after it was rendered from a cached response.

With { revalidate: 'auto' } Unpoly will revalidate expired responses. This behavior can be configured with up.fragment.config.autoRevalidate(response).

With { revalidate: true } Unpoly will always revalidate cached content, regardless of its age.

With { revalidate: false } Unpoly will never revalidate cached content.

Whether to scroll after the fragment was reloaded.

By default Unpoly will keep scroll positions of all viewports around the updated fragment.

See scrolling for a list of allowed values.

What to focus after the fragment was reloaded.

By default Unpoly will keep the current focus within the updated fragment.

See focus for a list of allowed values.

Disables form controls while the request is loading.

A placeholder to show within the targeted fragment while new content is loading.

Existing children of the targeted fragment will be hidden during the request. When the request ends for any reason, all changes will be reverted.

One or more previews that temporarily change the page while new content is loading.

The preview changes will be reverted automatically when the request ends for any reason.

Whether to set feedback classes while loading content.

Whether to preserve the fragment's data object throughout the update.

Properties from the new fragment's [up-data] are overridden with the old fragment's [up-data].

The data object for the new fragment.

If the new fragment already has an [up-data] object, properties from { data } take precedence.

When updating multiple fragments, { data } is only applied to the primary fragment. To apply data to multiple fragments, use { dataMap }.

See Overriding data for a render pass.

An object mapping selectors to data objects.

When a selector matches any element within an updated fragment, the matching element is compiled with the mapped data.

See Mapping selectors to data.

Whether [up-keep] elements will be kept in the updated fragments.

An object that will be merged into the context of the current layer once the fragment is rendered.

A message the user needs to confirm before any request or changes are made.

The message will be shown as a native confirmation dialog.

If the user does not confirm, no request is sent and no fragments are updated. In that case the render promise rejects with an up.Aborted error.

See Confirmation dialogs, also for showing a styled dialog instead of the browser's.

A callback that will be run when the server responds with new HTML, but before the HTML is rendered.

The callback argument is a preventable up:fragment:loaded event.

This callback will also run for error responses.

A callback that will be run when the fragment could not be loaded due to a disconnect or timeout.

The callback argument is an up:fragment:offline event. To try again, call event.retry().

A function to call when Unpoly has updated fragments.

This callback may be called zero, one or two times:

• When the server rendered an empty response, no fragments are updated. { onRendered } is not called.
• When the server rendered a matching fragment, it will be updated on the page. { onRendered } is called with the result.
• When revalidation renders a second time, { onRendered } is called again with the final result.

Also see Running code after rendering.

A function to call when no further DOM changes will be caused by this render pass.

The following state is considered "finished":

• Animations have concluded and transitioned elements have been removed from the DOM tree.
• Async compilers have settled.
• Cached content has been revalidated with the server.
  If the server has responded with fresher content, that content has also been rendered.

The callback argument is the last up.RenderResult that updated a fragment. If revalidation re-rendered the fragment, it is the result from the second render pass. If no revalidation was performed, or if revalidation yielded an empty response, it is the result from the initial render pass.

To run a callback after an error response has finished rendering, pass an { onFailFinished } option instead.

When a revalidation receives an error response, { onFinished } is not called. Instead { onFailRendered } and { onFailFinished } are called for the revalidation's error response.

Also see Awaiting post-processing.

A callback that will be run when any error is thrown during the rendering process.

The callback is also called when the render pass fails due to network issues, or aborts.

Also see Handling errors.