jQuery DatePicker - 2 Fields

2 Cevap php

Ben şu anda jQuery ile çalışma ve datepicker kullanıyorum.

Başlangıç ​​Tarihi ve Bitiş Tarihi: Ben iki giriş alanları var. Her tıklandığında, datepicker dışarı çıkar.

"Bitiş Tarihi" alanında, ben aynı gün vurgulamak için jQuery tarih seçici istiyorum. Bir kullanıcı başlangıç ​​tarihi olarak 8/12/09 alır Örneğin, Bitiş Tarihi, onlar 8/12/09 ÖNCE şey almak değildir.

İşte ben şu anda ne var:

$("#datepicker").datepicker({minDate: +5, maxDate: '+1M +10D', changeMonth: true});
var startDate = $("#datepicker").val();
var the_date = new Date(startDate);
$("#datepicker2").datepicker({ minDate: the_date });

Ve, unforunately, bu işe yaramazsa.

Ben bulduk, ben "sert-kod" gibi değerler:

$("#datepicker2").datepicker({ minDate: new Date("08/12/2009") });

bunun cezası çalışacaktır. Herhangi bir "bitiş tarihi" seçici için "başlangıç ​​tarihini" geçmek için nasıl bir fikir?

Teşekkürler!

2 Cevap

Bu cant iş

Eğer "toplama" olayı için tarih seçici bir geri çağırma işlevi gerekir. Bu olayın befor startDate boş olacaktır.

Bu deneyin:

$("#datepicker").datepicker({
     minDate: +5, 
     maxDate: '+1M +10D', 
     changeMonth: true, 
     onSelect: function(dateText, inst){
               var the_date = new Date(dateText);
               $("#datepicker2").datepicker('option', 'minDate', the_date);
     }
 });
 $("#datepicker2").datepicker(); // add options if you want

date time culture will be different for differ user. the jquery ui minimum is not working for that above code. and initially if i select end date then minimum date will not set for end date.

<input type="text" id="tbStartDate" value="" disabled="disabled" />
<input type="text" id="tbEndDate" value="" disabled="disabled" />

<script type="text/javascript">
    $(document).ready(function () {
        $("#tbStartDate").datepicker({
            //minDate: +5, 
            //maxDate: '+1M +10D', 
            //changeMonth: true,
            dateFormat: 'dd-mm-yy',
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: '/Content/Calendar.png',
            buttonText: 'Click here (date)',
            onSelect: function (dateText, inst) {
                $('#tbEndDate').datepicker("option", 'minDate', new Date($("#tbStartDate").datepicker('getDate')));
            },
            onClose: function (dateText, inst) {
                //$("#StartDate").val($("#tbStartDate").val());
            }
        });

        $("#tbEndDate").datepicker({
            dateFormat: 'dd-mm-yy',
            showOn: 'button',
            buttonImageOnly: true,
            buttonImage: '/Content/Calendar.png',
            buttonText: 'Click here (date)',
            onClose: function (dateText, inst) {
                //$("#EndDate").val($("#tbEndDate").val());
            }
        });

        $('#tbEndDate').datepicker("option", 'minDate', new Date($("#tbStartDate").datepicker('getDate')));
    });
</script>

etiketler