AlloyUI - API Docs

  • API Docs for Version: 3.1.0-deprecated.60

    • Show:

    PjaxContent Class

    Defined in: yui3/src/pjax/js/pjax-content.js:10
    Module: pjax-content
    Parent Module: pjax

    Available since 3.7.0

    Y.Router extension that provides the content fetching and handling needed to implement the standard pjax (HTMP5 pushState + Ajax) functionality.

    This makes it easy to fetch server rendered content for URLs using Ajax. By helping the router to fulfill the "request" for the content you can avoid full page loads.

    The PjaxContent class isn't useful on its own, but can be mixed into a Router-based class along with the PjaxBase class to add Pjax functionality to that Router. For a pre-made standalone Pjax router, see the Pjax class.

    var MyRouter = Y.Base.create('myRouter', Y.Router, [
                                Y.PjaxBase,
                                Y.PjaxContent
                            ], {
                                // ...
                            });

    Methods

    _onPjaxIOComplete

    (
    • id
    • ioResponse
    • details
    )
    protected

    Defined in yui3/src/pjax/js/pjax-content.js:159

    Available since 3.7.0

    Handles IO complete events.

    This parses the content from the Y.io() response and puts it on the route's response object.

    Parameters:

    • id String

      <p><p>The <code>Y.io</code> transaction id.</p></p>

    • ioResponse Object

      <p><p>The <code>Y.io</code> response object.</p></p>

    • details Object

      <p><p>Extra details carried through from <code>loadContent()</code>.</p></p>

    _onPjaxIOEnd

    (
    • id
    • details
    )
    protected

    Defined in yui3/src/pjax/js/pjax-content.js:189

    Available since 3.5.0

    Handles IO end events.

    Parameters:

    • id String

      <p><p>The <code>Y.io</code> transaction id.</p></p>

    • details Object

      <p><p>Extra details carried through from <code>loadContent()</code>.</p></p>

    getContent

    (
    • responseText
    )
    Object

    Defined in yui3/src/pjax/js/pjax-content.js:38

    Available since 3.5.0

    Extracts and returns the relevant HTML content from an Ajax response. The content is extracted using the contentSelector attribute as a CSS selector. If contentSelector is null, the entire response will be returned.

    The return value is an object containing two properties:

    • node: A Y.Node instance for a document fragment containing the extracted HTML content.

    • title: The title of the HTML page, if any, extracted using the titleSelector attribute (which defaults to looking for a <title> element). If titleSelector is not set or if a title could not be found, this property will be undefined.

    Parameters:

    • responseText String

      <p><p>Raw Ajax response text.</p></p>

    Returns:

    Object:

    <p><p>Content object with the properties described above.</p></p>

    loadContent

    (
    • req
    • res
    • next
    )

    Defined in yui3/src/pjax/js/pjax-content.js:83

    Available since 3.7.0

    Pjax route middleware to load content from a server. This makes an Ajax request for the requested URL, parses the returned content and puts it on the route's response object.

    This is route middleware and not intended to be the final callback for a route. This will add the following information to the route's request and response objects:

    • req.ioURL: The full URL that was used to make the Y.io() XHR. This may contain "pjax=1" if the addPjaxParam option is set.

    • res.content: An object containing node and title properties for the content extracted from the server's response. See getContent() for more details.

    • res.ioResponse: The full Y.io() response object. This is useful if you need access to the XHR's response status or HTTP headers.

    Parameters:

    • req Object

      <p><p>Request object.</p></p>

    • res Object

      <p><p>Response Object.</p></p>

    • next Function

      <p><p>Function to pass control to the next route callback.</p></p>

    Example:

    router.route('/foo/', 'loadContent', function (req, res, next) {
                                                    Y.one('container').setHTML(res.content.node);
                                                    Y.config.doc.title = res.content.title;
                                                });

    Attributes

    addPjaxParam

    Boolean

    Defined in yui3/src/pjax/js/pjax-content.js:204

    Available since 3.5.0

    If true, a "pjax=1" query parameter will be appended to all URLs requested via Pjax.

    Browsers ignore HTTP request headers when caching content, so if the same URL is used to request a partial Pjax page and a full page, the browser will cache them under the same key and may later load the cached partial page when the user actually requests a full page (or vice versa).

    To prevent this, we can add a bogus query parameter to the URL so that Pjax URLs will always be cached separately from non-Pjax URLs.

    Default: true

    contentSelector

    String

    Defined in yui3/src/pjax/js/pjax-content.js:226

    Available since 3.5.0

    CSS selector used to extract a specific portion of the content of a page loaded via Pjax.

    For example, if you wanted to load the page example.html but only use the content within an element with the id "pjax-content", you'd set contentSelector to "#pjax-content".

    If not set, the entire page will be used.

    Default: null

    timeout

    Number

    Defined in yui3/src/pjax/js/pjax-content.js:263

    Available since 3.5.0

    Time in milliseconds after which an Ajax request should time out.

    Default: 30000

    titleSelector

    String

    Defined in yui3/src/pjax/js/pjax-content.js:245

    Available since 3.5.0

    CSS selector used to extract a page title from the content of a page loaded via Pjax.

    By default this is set to extract the title from the <title> element, but you could customize it to extract the title from an <h1>, or from any other element, if that's more appropriate for the content you're loading.

    Default: "title"