如何編寫腳本來限制過去日期的 Ninja Form 日期選擇器？

Question

我使用 Ninja Forms 插件在我的 WordPress 網站中有一個日期選擇器字段。 我不認為該插件讓我可以選擇限制過去的日期。 所以我想實現用戶不能選擇任何過去的日期。

我當然試圖用谷歌搜索一個解決方案，但我對 javascript/jquery 並不是很擅長，也不明白我如何實現這一點。 任何人都可以幫忙嗎？ 提前謝謝了！

Answer 1

看起來 Ninja Forms 有一個提前日期選擇器選項我不熟悉但這里是鏈接

現在我不知道確切的 Ninja Forms 語法，但這應該會讓你的大腦開始震動。 add_filter()您可以使用add_filter()和類似的function創建一個小的自定義WP-plugin

<?php
  
  add_filter( 'ninja_form_date_limt'  );
  
  function ninja_form_date_limt() {
      wp_enqueue_script( 
        'ninja_form_date_limt', 
        plugin_dir_url( __FILE__ ) . 'script.js', 
        array( 'jquery' ), 
        false, 
        true 
      );
  }

這會調用theme/js/script.js文件中的JQuery或JavaScript函數，或者您保留自定義 JS 的任何地方，這可以使用這樣的東西。

var tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
dateObject.pikaday.setMinDate(tomorrow); 

Answer 2

通過結合我在網絡上找到的一些東西來解決這個問題，同時試圖解決這個問題。

只需將此代碼添加到您想要限制過去日期的日期選擇器的任何頁面。 這也限制了當天，所以他們必須從明天開始選擇。

<script>
jQuery(document).ready( function( $ ) {
var customDatePicker = Marionette.Object.extend( {
initialize: function() {

this.listenTo( Backbone.Radio.channel( 'flatpickr' ), 'init', this.modifyDatepicker );
},
modifyDatepicker: function( dateObject, fieldModel ) {
var tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
dateObject.set("minDate", tomorrow );
}
});


new customDatePicker();
} );
</script>