Question

我在我的WordPress网站上使用高级自定义字段，我有一个datepicker开始日期＆amp;结束日期，我试图在选择一个时设置最小值/最大值。来自 jQuery的datepicker日期范围我正在尝试添加 onClose 选项。

我目前有以下代码基于custom javascript fields page，但它无效。

<?php function takeover_scripts() { ?>

  <script type="text/javascript">
    (function($) {

      var startDate = $('.acf-field-568d4b2968a3e');
      acf.add_filter('date_picker_args', function( args, startDate ){
        // do something to args
        args.changeMonth = false;
        args.onClose = function( selectedDate ) {
          $( ".acf-field-568d4bbd68a3f" ).datepicker( "option", "minDate", selectedDate );
        }
        // return
        return args;
      });

      var endDate = $('.acf-field-568d4bbd68a3f');
      acf.add_filter('date_picker_args', function( args, endDate ){
        // do something to args
        args.changeMonth = true;
        args.onClose = function( selectedDate ) {
          $( ".acf-field-568d4b2968a3e" ).datepicker( "option", "minDate", selectedDate );
        }
        // return
        return args;
      });

    })(jQuery); 
  </script>

<?php }

add_action('acf/input/admin_footer', 'takeover_scripts'); ?>

我不确定是否需要定位结束日期输入的ID或字段编号，或者我是否正确选择了开始日期字段。如果有任何人有这方面的经验，请让我知道我在设置/选择错误。

以下是两个字段的标记：

<div class="acf-field acf-field-date-picker acf-field-568d4b2968a3e" style="width:25%;" data-name="start_date" data-type="date_picker" data-key="field_568d4b2968a3e" data-required="1" data-width="25">
    <div class="acf-label">
        <label for="acf-field_568d479e68a3b-0-field_568d4b2968a3e">Start Date <span class="acf-required">*</span></label>
    </div>
    <div class="acf-input">
        <div class="acf-date_picker acf-input-wrap" data-display_format="MM d, yy" data-first_day="0">
            <input id="acf-field_568d479e68a3b-0-field_568d4b2968a3e" class="input-alt" type="hidden" name="acf[field_568d479e68a3b][0][field_568d4b2968a3e]" value="">
            <input type="text" value="" class="input active hasDatepicker" id="dp1452127570218">
        </div>      
    </div>
</div>

<div class="acf-field acf-field-date-picker acf-field-568d4bbd68a3f" style="width:25%;" data-name="end_date" data-type="date_picker" data-key="field_568d4bbd68a3f" data-required="1" data-width="25">
    <div class="acf-label">
        <label for="acf-field_568d479e68a3b-0-field_568d4bbd68a3f">End Date <span class="acf-required">*</span></label>
    </div>
    <div class="acf-input">
        <div class="acf-date_picker acf-input-wrap" data-display_format="MM d, yy" data-first_day="0"><input id="acf-field_568d479e68a3b-0-field_568d4bbd68a3f" class="input-alt" type="hidden" name="acf[field_568d479e68a3b][0][field_568d4bbd68a3f]" value=""><input type="text" value="" class="input active hasDatepicker" id="dp1452127570219"></div>     
    </div>
</div>

由于

P.S。：我也在ACF的支持下找到here。

Answer 1

有点晚了，但是我终于想通了。

因此，原来需要在类为.datepicker()的输入字段上调用.hasDatepicker函数，而不是具有acf id的输入字段。

我有以下工作：

$('.acf-field-568d4b2968a3e').find('.hasDatepicker').datepicker('option', 'minDate', minDateVar );

希望这对某人有帮助！

WordPress ACF管理员Datepicker范围

1 个答案: