Форум

katamason · #1 (**permalink**) 29.04.2016, 01:17

Доброе время суток, прошу помощи с datepicker'om, пытаюсь выставить значения от и до, и с соблюдением интервала, т.е где значение "до" всегда выше чем "от" , и скармливаю календарь на страницу, но в итоге не работает как бы хотелось, почему и прошу помощи
Код

<input class="input_01" id="startdate_1" placeholder="" type="text" value="">
                 <input class="input_01" id="enddate_1" placeholder="" type="text" value="">

    <div class="dp_date from_1 dpcust act" data-altfield="#startdate_1" ></div>
                                             <div class="dp_date to_1 dpcust" data-altfield="#enddate_1"></div>

/*dp_date.from_1 start*/
     $(".dp_date.from_1").datepicker({
         changeMonth: false,    
         altFormat: "dd.mm.y",
         altField: $('#startdate_1'),
         onSelect: function(date, obj){
             
        function cutYear() {
        delimiter = '.',
        start = 2,
        tokens = date.split(delimiter).slice(start),
        dm = tokens.join(delimiter);  
        substr = date.substr(0,6);
        year = dm.substr(2,4);
            return (substr +  year).toString();
        }
        
         $('#startdate_1').val(cutYear());   
        },
         onClose: function(selectedDate) {
            $("#enddate_1").datepicker("option", "minDate", selectedDate);
        }
    });
    
    /*dp_date.from_1 end */
    
    /*.dp_date.to_1 start*/
    
        $(".dp_date.to_1").datepicker({
        changeMonth: false,    
        altFormat: "dd.mm.y",
        altField: $('#enddate_1'),
        onSelect: function(date, obj){
            
          function cutYear() {
        delimiter = '.',
        start = 2,
        tokens = date.split(delimiter).slice(start),
        dm = tokens.join(delimiter);  
        substr = date.substr(0,6);
        year = dm.substr(2,4);
            return (substr +  year).toString();
        }  
         
        $('#enddate_1').val(cutYear());   
        },
        
         onClose: function(selectedDate) {
            $("#startdate_1").datepicker("option", "maxDate", selectedDate);
        }
        
        
        });
         /*.dp_date.to_1 end */

рони · #2 (**permalink**) 29.04.2016, 13:27

Сообщение от katamason

function cutYear()

для чего эта функция?

katamason · #3 (**permalink**) 29.04.2016, 16:24

рони,
Она ничего страшного не делает, просто обрезаю дату 12.08.2016 до 12.08.16 , так как в чистом виде altFormat: "dd.mm.y" не помогает, но может я что то перемудрил конечно

рони · #4 (**permalink**) 29.04.2016, 17:12

katamason,

<!doctype html>



<html lang="en">

<head>

  <meta charset="utf-8" />

  <title>jQuery UI Datepicker - Default functionality</title>

  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/sunny/jquery-ui.css" />

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

  <link rel="stylesheet" href="/resources/demos/style.css" />
   <style type="text/css">

   body{
     font-size: 12px;
   }
.active .ui-state-default{
    background: rgba(102, 255, 102, 1)
}
.active:hover .ui-state-default{
    background: rgba(255, 255, 0, 1)
}
   </style>
  <script>

  $(function() {

    $.datepicker.regional['ru'] = {
		closeText: 'Закрыть',
		prevText: '&#x3c;Пред',
		nextText: 'След&#x3e;',
		currentText: 'Сегодня',
		monthNames: ['Январь','Февраль','Март','Апрель','Май','Июнь', 'Июль','Август','Сентябрь','Октябрь','Ноябрь','Декабрь'],
		monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн', 'Июл','Авг','Сен','Окт','Ноя','Дек'],
		dayNames: ['воскресенье','понедельник','вторник','среда','четверг','пятница','суббота'],
		dayNamesShort: ['вск','пнд','втр','срд','чтв','птн','сбт'],
		dayNamesMin: ['Вс','Пн','Вт','Ср','Чт','Пт','Сб'],
		dateFormat: 'dd.mm.yy',
		firstDay: 1,
		isRTL: false,
		showOtherMonths:true,
		selectOtherMonths:true,
		changeMonth:true,
        changeYear: false,
        showAnim:'scale'
};
$.datepicker.setDefaults($.datepicker.regional['ru']);

$(".from_1").datepicker({
    changeMonth: false,
    altFormat: "dd.mm.y",
    altField: "#startdate_1",
    onSelect: function(selectedDate) {
        $(".to_1").datepicker("option", "minDate", selectedDate)
    }
});
$(".to_1").datepicker({
    changeMonth: false,
    altFormat: "dd.mm.y",
    altField: "#enddate_1",
    onSelect: function(selectedDate) {
        $(".from_1").datepicker("option", "maxDate", selectedDate)
    }
});
  });
  </script>
</head>
<body>
<input class="input_01" id="startdate_1" placeholder="" type="text" value="">
<input class="input_01" id="enddate_1" placeholder="" type="text" value="">

    <div class="dp_date from_1 dpcust act" ></div>
    <div class="dp_date to_1 dpcust" ></div>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript