• 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.

    Timepicker (gallery-timepicker) on cdn

    Last Updated: 10/30/09
    + 4 -

    Stephen Woods

    YUI Contributor

    Featured Item

    Created: 10/23/09
    Last CDN Push: 10/12/11
    Build Tag: gallery-2011.10.12-20-24
    Project: YUI 3
    License: YUI BSD
    YUI Version: 3.0.0
    Free for use.
    Module Image

    Creates a very cool little timepicker:

    http://img.skitch.com/20091023-msrt5fbjyfdc5825shwp4ytp8t.png

    • Download
    • Docs
    • Homepage
    • Bugs
    • Source
    • Example
    • Forum
    • History

    Attach a timepicker widget to a text input.

    Code Sample

    <script src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"></script>
    YUI({
        //Last Gallery Build of this module
        gallery: 'gallery-2011.10.12-20-24'
    }).use('gallery-timepicker', function(Y) {
     
     var picker = new Y.Saw.Timepicker({contentBox: '#cb'}); //assuming this exists
                    picker.render();
     
                    //hide
                    picker.hide();
     
                    //show
                    picker.show();
     
                    //set am or pm with class constants
                    picker.set('time.ampm', picker.AM);
     
                    //subscribe to events to do cool stuff:
                    picker.subscribe('timeset', function(data){
                        //fires when the time changes
     
                        //put the 12 hour string into the input. s24hour is also available
                        Y.get('#time').set('value' ,data.s12hour); //#time should be a text input
     
                        //the data object also has members for hour, minute, ampm. Ampm is
                        //an int identified by picker.AM or picker.PM
                    });
     
                    picker.subscribe('cellclick', function(e){
                        //fires when a cell is clicked.
                       this.hide(); 
                    },picker);
    });

    Forum Posts

    Subject Author Date
    Feature Requests Stephen Woods 10/31/09
    Re: Feature Requests Viktor Rennert 11/2/09
    Re: Feature Requests Stephen Woods 11/2/09
    Re: Feature Requests johng 02/20/10
    Re: Feature Requests Joss DaBoss 02/20/10
    Re: Feature Requests Stephen Woods 02/23/10
    Re: Feature Requests Stephen Woods 02/23/10
    Re: Feature Requests Stephen Woods 02/23/10
    Re: Feature Requests Stephen Woods 02/26/10
    Timepicker blog post Eric Miraglia 03/3/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