• Register
  • Log In
  • Home
  • Quick Start
    • Configurator
    • Download YUI 3
  • Documentation
    • User Guides
    • Examples
    • API Docs
    • Environments
    • Tutorials
  • Community
    • Gallery
    • Blog
    • Forums
    • YUI Theater
    • Calendar
  • Contribute
    • YUI on GitHub »
    • File a Ticket
    • View Tickets
    • Dashboard
  • Other Projects
    • Shifter »
    • Yogi »
    • YUI 2
    • YUI Doc »
    • YUI Test
    • YUI Website
    • YUI Compressor »
    • YUI Builder »
    • YUI PHP Loader
    • Grid Builder »
    • Skin Builder »
  • YUI
  • >
  • Community
  • >
  • Gallery

Gallery

Modules

  • Home
  • Featured
  • Popular
  • New
  • All

Documentation

  • Yogi Documentation
  • Shifter Documentation
  • Developer Guide
  • Module Setup

Tag Cloud

Context Navigation

    YUI Library is not responsible for bugs or support with this module. It is available as a free service. For support please contact the module owner with the provided links.

    Dispatcher (gallery-dispatcher) on cdn

    Last Updated: 05/1/11
    + 1 -

    Caridy Patino

    YUI Contributor

    See 11 more by this user.

    Created: 11/26/09
    Last CDN Push: 05/12/11
    Build Tag: gallery-2011.05.12-13-26
    Project: YUI 3
    License: YUI BSD
    YUI Version: 3.3.0
    Free for use.

    Overview

    The Dispatcher satisfies a very common need of developers using the YUI library: dynamic execution of Ajax response content. Typical strategies to fulfill this need, like executing the innerHTML property or referencing remote scripts, are unreliable due to browser incompatibilities. The Dispatcher normalizes this behavior across all a-grade browsers.

    Usage

    Dispatcher extends Base, here is the syntax to create a dispatcher obj:

    // Call the "use" method, passing in "gallery-dispatcher". This will 
    // load the dispatcher module and all the required dependencies.
    YUI().use("gallery-dispatcher", function(Y) {
    var obj = new Y.Dispatcher({
    node: '#demo'
    });
    // Setting a simple content
    obj.set('content', '<p>content that will be injected within #demo</p>');
    // Loading a fragment through AJAX
    obj.set('uri', '/get/html/fragment.php');
    });

    Use "uri" or "content" attributes to inject new content within a "node":

    • content: to inject a html fragment into a Node.
    • uri: to use io module to load an html fragment and inject it into a Node.
    • normalize: set to true to enabling normalization process in you plan to inject a html document instead of a regular html fragment.

    There are also numerous events that you can listen for during the life cycle as well, check the documentation for more details.

    More attributes and other details here:

    • http://caridy.github.com/api/gallery-dispatcher/Y.Dispatcher.html

    Examples

    • http://caridy.github.com/examples/gallery-dispatcher/simple.html

    Tests

    Run this test in your browser and report any issue.

    • http://caridy.name/sandbox/yui3-gallery/src/gallery-dispatcher/tests/dispatcher.html

    Note: Make sure you include OS, Browser Version and the test result from YUI Console in your ticket.

    CHANGELOG

    Check the latest changes in this module.

    • http://github.com/caridy/yui3-gallery/tree/master/src/gallery-dispatcher/
    • Tags:
    • ajax
    • caridy
    • dispatcher
    • io
    • bubbling
    • javascript
    • Download
    • Docs
    • Homepage
    • Bugs
    • Source
    • Example
    • Forum
    • History

    Very simple example to inject two HTML fragments, one of then setting the content directly, and the other one using io. In both cases the content will be injected into a node (selector: #demo or #demoajax). In the process, the dispatcher will execute JS, and inject CSS into the current page.

    Code Sample

    <script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js"></script>
    YUI({
        //Last Gallery Build of this module
        gallery: 'gallery-2011.05.12-13-26'
    }).use('gallery-dispatcher', function(Y) {
     
      new Y.Dispatcher ({
            node: '#demo',
            content: '<p>Please wait... (Injecting Static Markup)</p>'
      }).set('content', "<p>HTML Fragment with style, link and/or script tags (eg. <style>body{color:red;}</style>)");
     
      new Y.Dispatcher ({
            node: '#demoajax',
            content: 'Please wait... (Injecting External Markup: fragment.html)'
      }).set('uri', 'fragment.html');
     
    });

    Forum Posts

    Subject Author Date
    How to load gallery-dispatcher alexlebek 12/17/09
    Re: How to load gallery-dispatcher Caridy Patino 12/18/09
    Trouble using the dispatcher David Robert 03/5/10
    Re: Trouble using the dispatcher Caridy Patino 03/5/10
    Re: Trouble using the dispatcher David Robert 03/17/10
    Re: Trouble using the dispatcher Caridy Patino 03/18/10
    Trouble loading html fragment with script Marc 04/26/10
    Re: Trouble loading html fragment with script Caridy Patino 04/26/10
    Re: Trouble loading html fragment with script Marc 04/26/10
    Re: Trouble loading html fragment with script Caridy Patino 04/26/10

    © 2006-2013 Yahoo! Inc. All rights reserved.
    All code on this site is licensed under the BSD License unless stated otherwise.
    About This Site · Security Contact Info