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

    Query Builder Extras(includes date range) (gallery-querybuilder-extras) on cdn

    Last Updated: 08/1/12
    + 2 -

    Mayank Gupta

    YUI Contributor

    See 1 more by this user.

    Created: 05/17/12
    Last CDN Push: 08/8/12
    Build Tag: gallery-2012.08.08-20-03
    Project: YUI 3
    License: YUI BSD
    YUI Version: 3.6.0pr4
    Free for use.

    This uses John Lindal's Querybuilder http://yuilibrary.com/gallery/show/querybuilder only extension is calendar type.

    • Tags:
    • mzgupta
    • Download
    • Docs
    • Homepage
    • Bugs
    • Source
    • Example
    • Forum
    • History

    start_date : Date Object optional parameter for start date for operation that need range
    end_date : Date Object optional parameter for end date for operation that need range

    date_format : For date formatting http://yuilibrary.com/yui/docs/api/classes/DataType.Date.html#method_format

    calendar_config : As mentioned http://yuilibrary.com/yui/docs/calendar/

    multipleValue : (default false) if true then it will show date range

    Code Sample

    <script src="http://yui.yahooapis.com/3.6.0pr4/build/yui/yui-min.js"></script>
    	YUI({gallery:"gallery-2012.05.23-19-56",debug:true})
    			.use(
    					"gallery-querybuilder-extras",
    					function(Y) {
    						var var_list = [ {
    							name : 'url',
    							type : 'string',
    							text : 'URL',
    							validation : 'yiv-length:[,3000]'
    						}, {
    							name : 'impressions',
    							type : 'number',
    							text : 'Impressions (1000s)',
    							validation : 'yiv-integer'
    						}, {
    							name : 'ctr',
    							type : 'number',
    							text : 'Click-through rate (%)',
    							validation : 'yiv-decimal:[0,]'
    						}, {
    							name : 'flag',
    							type : 'select',
    							text : 'Flagged',
    							value_list : [ {
    								value : "true",
    								text : 'True'
    							}, {
    								value : "false",
    								text : 'False'
    							} ]
    						}, {
    							name : 'date',
    							type : 'calendar',
    							text : 'date',
    							date_format:'%c',
    							start_date : new Date(79,5,24),
    							end_date : new Date(79,5,24),
    							calendar_config: {
    						            height  : "215px",
    						            width   : "200px",
    						            visible : true,
    						            showPrevMonth : true,
    						            showNextMonth : true,
    						            date : new Date()
    						     }
    						}, {
    							name : 'submission_status',
    							type : 'select',
    							text : 'Status',
    							value_list : [ {
    								value : "I",
    								text : 'Action Required'
    							}, {
    								value : "S",
    								text : 'Submitted'
    							}, {
    								value : "A",
    								text : 'Submission Accepted'
    							}, {
    								value : "B",
    								text : 'Submission Auto-Accepted'
    							} ]
    						} ];
     
    						var ops = {
    							string : [ {
    								value : 'equal',
    								text : 'Is'
    							}, {
    								value : 'contains',
    								text : 'Contains'
    							}, {
    								value : 'starts-with',
    								text : 'Starts with'
    							}, {
    								value : 'ends-with',
    								text : 'Ends with'
    							} ],
     
    							number : [
    									{
    										value : 'equal',
    										text : '= Equals'
    									},
    									{
    										value : 'less',
    										text : '< Less than'
    									},
    									{
    										value : 'less-equal',
    										text : '<= Less than or equal to' 
    								    },
                                        { 
    								    	value: 'greater',   
    								    	text: '> Greater than'
    									}, {
    										value : 'greater-equal',
    										text : '>= Greater than or equal to'
    									} ],
    							calendar : [ {
    								value : 'equal',
    								text : 'Is'
    							}, {
    								value : 'between',
    								text : 'Between',
    								multipleValue : true
    							}
     
    							],
     
    							select : [ 'EQUALS' ]
    						};
     
    						var query = new Y.QueryBuilder(var_list, ops);
    						query.render('#query');
    						Y.on('click', query.validateFields, '#btn', query);
     
    					});

    © 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