air-datepicker icon indicating copy to clipboard operation
air-datepicker copied to clipboard

My way to set the (default) date from input

Open ivan-cc opened this issue 5 years ago • 2 comments

$("#dateField").datepicker({
    maxDate:new Date(), 
    autoClose:true, 
    dateFormat:"dd.mm.yyyy"
})
.each( function(){ 
        $(this).data("datepicker").selectDate(  parseDateFromString( this.value ) );
    });
function parseDateFromString(str)
{
	//replace bad separator 	to .
	str = str.replace(/[,\/\-]/g, '.').split('.');
	if( str.length != 3)
	{
		return null;
	}

    if( str[0] == 0 || str[0] > 31)
    {
       return null;
    }
  
    if( str[1] == 0 || str[1] > 12)
    {
       return null;
    }  
  
	if( str[2].length == 1 || str[2].length == 2)
      {
        str[2] = 2000+parseInt(str[2]);
      }
	  else if(str[2].length == 4 && (str[2] < 1900 || str[2] > 2040 ) )
	  {
		return null;
	  }

    return new Date(str[2], str[1]-1, str[0]);
}

ivan-cc avatar Aug 03 '19 14:08 ivan-cc

Tks! Works perfectly.

If anyone uses moment.js:

$('.date_input')
    .datepicker({
      language: 'pt',
      todayButton: new Date()
    })
    .each(function() {
      if ($(this).val())
        $(this)
          .data('datepicker')
          .selectDate(moment($(this).val(), 'DD/MM/YYYY').toDate())
      })

alexandrebenkendorf avatar Aug 12 '19 09:08 alexandrebenkendorf

To duplicate the code less, I made a separate function for the air-datepicker. My final code is:

function ohMyDatepicker(element, settings)
{
    if( settings == undefined)
        settings = {};

    //set default values
    if(settings['dateFormat'] == undefined)
        settings['dateFormat']='dd.mm.yyyy';

    if(settings['autoClose'] == undefined)
        settings['autoClose'] = true;

    if(settings['maxDate'] == undefined)
        settings['maxDate'] = new Date();

//...


    element =  $(element);
    if( element.attr('type') != 'text' )
    {
        element.attr('type', 'text');
    }

    element.datepicker(settings).each( function(){
        $(this).data("datepicker").selectDate(  parseDateFromString( this.value ) );
    });


    //So that when you press Enter, the entered date is set.
    element.on("keydown", function(e) {
        if (e.which == 13 || e.keyCode == 13) {
            e.preventDefault();
                $(this).data("datepicker").selectDate( parseDateFromString(this.value) );
        }
    });

    return element.data("datepicker");
}

ivan-cc avatar Aug 12 '19 13:08 ivan-cc