Jquery UI Datepicker com EOM e MOM

Question

Preciso implementar um calendário Jquery UI que quando um usuário clica em qualquer data, ele seleciona automaticamente para o próximo MOM ou EOM.

Por exemplo, se o usuário clicar em 9 de abril, ele deverá ir para '15 de abril' ou se clicar em 22 de fevereiro, ele deve ir para '28 de fevereiro' ou 'fevereiro 29'.

Para esclarecimentos:MOM é “Meio do Mês, toda hora é dia 15”, de 1 a 15 de qualquer mês.EOM é "Fim do mês, é o último dia do mês, 31 de janeiro, 28 ou 29 de fevereiro, 31 de março, 30 de abril, 31 de maio, 30 de junho, 31 de julho, 31 de agosto, 30 de setembro, 31 de outubro, 30 de novembro, 31 de dezembro...

Obrigado

Answer 1

O código que funciona com IE6/IE7/IE8/IE9 e FF, Chrome, etc.

    <script type="text/javascript">
    $(function() {
        $("#payperiodcalendar input").datepicker({
            dateFormat: 'dd-M-yy',
            onSelect: function(dateText, inst) {
                var selectedDay = inst.currentDay,
                selectedMonth = inst.currentMonth,
                selectedYear = inst.currentYear;



                if (selectedDay <= 15) {
                    var now = new Date(selectedYear, selectedMonth, 15);
                } else {
                    var now = new Date(selectedYear, selectedMonth, LastDayOfMonth(selectedYear, selectedMonth));
                }
                $(this).attr("value", now.format("dd-MMM-yyyy"));

            }
        });
        function LastDayOfMonth(Year, Month) {
            Month++;
            return (new Date((new Date(Year, Month, 1)) - 1)).getDate();
        }
    });



</script>

Answer 2

Eu faria isso como um manipulador padrão JQuery Onchange para a caixa de texto.A razão é que um usuário pode ignorar o selecionador de data e digitar em uma data manualmente.Você deseja que a data seja automaticamente alterada, não importa se a data for selecionada, digitada ou colada.

Answer 3

Use o evento onSelect do datepicker.Esteja ciente de que se você tiver a opção maxDate definida e for anterior a EOM ou MOM, o valor selecionado será maxDate.

ATUALIZAR:Fechar após selecionar.Use onClose em vez disso.

ATUALIZAÇÃO2: jsFiddle usando a interface jQuery mais recente

  onClose: function(dateText, inst) {
    var day = inst.currentDay,
        month = inst.currentMonth,
        year = inst.currentYear;

    if (day <= 15) {
      day = 15;
    }
    else {
      day = 0;
      if (month>10){
        month = 0;
        year++;
      }
      else
        month++;
    }
    var d = new Date(year, month, day);
    $(this).datepicker("setDate", d);
  }