jquery-nativepicker

provides html5-input types as a fallback for common javascript controls

Features

• toggles a html5-input picker control
• integrates with common javascript controls

Examples

Using Bootstrap Datepicker

$('.datepicker').datepicker().nativepicker({
  type: 'date',
  change: function(value) {
    $(this).datepicker('update', value ? new Date(value) : "");
  }, 
  show: function() {
    var value = $(this).data('datepicker').getDate();
    $(this).data('nativePicker').setPickerValue(value);
  }
})

Using Bootstrap Select

note that bootstrap-select has built-in support for native-select on mobile.

$('.selectpicker').selectpicker().nativepicker({
  toggle: function() {
    return $(this).next().find('.btn');
  }
});  

Native only

$('.nativepicker').nativepicker({
  toggle: function() {
    return $($(this).next('.btn')[0]);
  }
});

Get access to the plugin-instance:

var nativepicker = $(".nativepicker").data('nativepicker');

Options

event that triggers the native picker

Name	Description	Default
change	callback that fires when the nativepicker value has changed
picker	function for retrieving the native input
show	callback that fires before the nativepicker shows up
toggle	function for retrieving the toggle element
toggleEvent		touchstart mousedown
type	type of the native input, e.g. 'date'	auto

Methods

Name	Description	Return
setPickerValue	sets the picker value	void
getPickerValue	gets the picker value	string

Example Demo

http://rawgithub.com/benignware/jquery-nativepicker/master/examples/index.html