0

很好地研究如何为 Jquery UI .datepicker 创建一个基于数学的自定义 minDate 我发现文档并不是真的在那里选择一个日历日期,然后将该日期设置为另一个日历的新 minDate。

但在完成此工作后,我构建了这组函数以在 jquery、php 和 jquery UI .datepicker 中创建日期差异。

请查看此内容并根据需要对其进行任何更改(我在工作中匆忙对其进行了编码以解决问题)我相信它确实会帮助其他人寻找此内容,因为我花了数周时间才将其完成。因为 Jquery UI 并没有非常多地记录这样的功能。

jQuerREL( "#rent_from, #rent_until" ).datepicker( {
  minDate: "+0",
  dateFormat: "<?php echo transforDateFromPhpToJquery();?>",
  beforeShowDay: unavailable,
  onClose: function () {
  jQuerREL.ajax({
    type: "POST",
    update: jQuerREL(" #alert_date "),
    success: function( data ) {
      jQuerREL("#alert_date").html("");
    }
  });

  var rent_from = jQuerREL(" #rent_from ").val();
  var rent_until = jQuerREL(" #rent_until ").val();
  var todaysDate = '<?php echo $now;  ?>';
  var diffpickDate = Math.floor(( Date.parse(rent_from) - Date.parse(todaysDate) ) / 86400000);
  var dates_added = Math.floor( diffpickDate + 30);
  var mindateNew = ' "+' + dates_added + 'd"';
  console.log('Todays Date: ' + todaysDate);
  console.log('Picked Date: ' + rent_from)
  console.log('Difference in days ' + diffpickDate);
  console.log(mindateNew);
  
  jQuerREL.ajax({
    type: "POST",
    url: "index.php?option=com_realestatemanager&task=ajax_rent_calcualete"
                    +"&bid=<?php echo $house->id; ?>&rent_from="+
                    rent_from+"&rent_until="+rent_until,
    data: { " #do " : " #1 " },
    update: jQuerREL(" #message-here "),
    success: function( data ) {
      jQuerREL("#message-here").html(data);
      jQuerREL("#calculated_price").val(data);
    }
  });

  jQuerREL("#rent_until").datepicker(
    "option", {
      changeMonth: true,
      gotoCurrent: true,
      minDate: mindateNew,
      onSelect: function(date) {
        minDate: "+30d"
        //alert(date);
      }
    }
  );
  } //end of onClose
  //jQuerREL( "#rent_until").datepicker("option", "minDate", "+30d", "changeMonths", true, "gotoCurrent", true );
  });
<form action="https://www.thebindel.com/student-housing/16/save_rent_request?Itemid=160" method="post" name="rent_request_form">
    <div id="show_buying">
        <input name="bid[]" value="31" type="hidden">
        <input name="houseid" id="houseid" value="31" maxlength="80" type="hidden">
        <input name="calculated_price" id="calculated_price" value="0" maxlength="80" type="hidden">
        <div class="row_01">
            <div id="user_name_warning"></div>
            <input class="inputbox" id="alert_name" name="user_name" size="38" maxlength="80" placeholder="Name*" type="text">
        </div>
        <div class="row_02">
            <div id="user_email_warning"></div>
            <input style="color: rgb(163, 163, 163); border-color: rgb(221, 221, 221);" class="inputbox" id="alert_mail" name="user_email" size="30" maxlength="80" placeholder="Email*" type="text">
        </div>
        <script type="text/javascript">
            Date.prototype.toLocaleFormat = function(format) {
                var f = {Y : this.getYear() + 1900,m : this.getMonth() + 1,d : this.getDate(),
                  H : this.getHours(),M : this.getMinutes(),S : this.getSeconds()}
                for(k in f)
                    format = format.replace('%' + k, f[k] < 10 ? "0" + f[k] : f[k]);
                return format;
            };
            window.onload = function ()
            {
                var today = new Date();
                var date = today.toLocaleFormat("%m-%d-%Y");
               //fix later //first load date dug.
               // document.getElementById('rent_from').value = date;
               // document.getElementById('rent_until').value = date;
            };
        </script>
        <div class="row_05">
            <textarea name="user_mailing" cols="50" rows="8" placeholder="Description"></textarea>
        </div>
        <div class="row_06">
            <p>Check In:</p>
            <p><input style="color: rgb(163, 163, 163); border-color: rgb(221, 221, 221);" placeholder="" class="hasDatepicker" id="rent_from" name="rent_from" type="text"></p>
        </div>
        <div class="row_07">
            <p>Check Out:</p>
            <p><input style="color: rgb(163, 163, 163); border-color: rgb(221, 221, 221);" placeholder="" class="hasDatepicker" id="rent_until" name="rent_until" type="text"></p>
        </div>
    </div>
    <div id="alert_date" name="alert_date"></div>
    <div id="price_1">
        <span>Price Per Month: </span>
        <span id="message-here">0</span>
        <span></span>
    </div>
    <div id="message-here"> </div>
    <div class="submit-container">
        <br>
        <input value="Request to Rent " class="button wdac-button button-block btn-primary" onclick="rem_rent_request_submitbutton()" type="button">
        <br>
    </div>
</form>
<!-- PHP code needed to grab the current date and make a diff of this date with the date selected on the first calendar -->
<?php   $now = date('m-d-Y'); ?>

4

0 回答 0