Kustomisasi hari yang dapat diklik pada popup Kalender

10

Saya membuat formulir di Drupal 7 dengan formulir API. Saat ini, saya dapat membuat bidang input kalender biasa dengan kode berikut:

   $form['services_tab']['schedule_datepicker'] = array(
    '#title' => t('Pick the desired date'),
    '#type' => 'date_popup',
    '#date_year_range' => '0:0',
    '#date_format' => 'Y-m-d',
    '#prefix' => '<div id="datepicker-schedule">',
    '#suffix' => '</div>',
  );

Saat ini saya bisa menampilkan munculan kalender yang indah. Yang ingin saya capai adalah mengaktifkan atau menonaktifkan tanggal tertentu berdasarkan aturan seperti: nonaktifkan semua hari Sabtu dan Minggu; atau bahkan menghapus status klik dari tanggal tertentu berdasarkan daftar hari libur nasional ...

Apakah ini sesuatu yang dapat dicapai dengan pengkodean PHP, atau apakah perlu dilakukan dengan jQuery? Dalam hal jQuery adalah solusinya, saya akan menghargai setiap petunjuk tentang cara melakukan itu ... Kalender adalah sebuah tabel, tetapi sel-sel tabel tidak memiliki ID atau sesuatu yang dapat membantu saya menemukan dan menonaktifkannya berdasarkan aturan. ..

Terima kasih.

Marcos Buarque
sumber
1
Jawaban "[Cara menonaktifkan akhir pekan] [1]" ini akan membantu Anda menonaktifkan akhir pekan dan beberapa hari. [1]: stackoverflow.com/questions/501943/…
Nikit

Jawaban:

8

Anda bisa meneruskan beberapa opsi Datepicker dari php ke elemen date_popup melalui kunci '#datepicker_options':

<?php
$form['date'] = array(
  '#title' => t('Pick the desired date'),
  '#type' => 'date_popup',
  '#datepicker_options' => array(
    'minDate' => 0,
  ),
);

Dengan metode ini Anda dapat melewati hampir semua opsi selain yang menerima fungsi sebagai nilai, karena beforeShowDay, yang diperlukan untuk membatasi akhir pekan atau hari libur sesuai dengan jawaban yang dirujuk oleh Nikit: /programming/501943/can- the-jquery-ui-datepicker-be-made-to-disable-saturdays-and-sundays-and-holid

Karenanya, javascript diperlukan. Pertama, Anda perlu memasukkan file js khusus dari kode modul Anda:

<?php
drupal_add_js(drupal_get_path('module', 'FOO') . '/FOO.js');

dan berikan beberapa kode FOO.jsuntuk memperluas pengaturan yang ditetapkan oleh modul date_popup dengan opsi kita sendiri.

Berikut adalah contoh yang menambahkan opsi dasar untuk menonaktifkan akhir pekan untuk semua widget datepicker di halaman:

(function ($) {
Drupal.behaviors.FOO = {
  attach: function (context) {
    for (var id in Drupal.settings.datePopup) {
      Drupal.settings.datePopup[id].settings.beforeShowDay = $.datepicker.noWeekends;
    }
  }
};
})(jQuery);

Perpanjang liburan dibiarkan sebagai latihan untuk pembaca :)

Catatan: tiga kejadian FOOdalam contoh saya tidak harus literal yang sama, yaitu: Anda dapat memberikan BAZperilaku BAR.jsdari FOO.module.

Pembaruan: untuk memperpanjang di atas untuk ketersediaan hari kustom, cukup tambahkan fungsi yang mengembalikan true / false untuk hari yang diterima oleh parameter.

(function ($) {
Drupal.behaviors.FOO = {
  attach: function (context) {
    for (var id in Drupal.settings.datePopup) {
      Drupal.settings.datePopup[id].settings.beforeShowDay = checkDate;
    }
  }
};

function checkDate(date) {
  if ((date.getDate() % 2) == 0) {
    return [false, 'Even days not available'];
  }
  else {
    return [true, 'Odd days are fine'];
  }
}
})(jQuery);

Anda dapat menemukan contoh yang lebih lengkap dalam modul Pembatasan Tanggal .

jonhattan
sumber
Terima kasih, Jonhattan! Saya telah berhasil mengatur minDate dan menonaktifkan semua hari terakhir. Ini adalah awal yang baik bagi saya. Saya ingin tahu apakah saya dapat mengatur sesuatu seperti maxDate, karena saya ingin tetap hanya sekitar 15 hari yang diaktifkan. Saya bisa melihat ada atribut 'fromTo', tetapi tidak memiliki petunjuk tentang apa yang akan dilakukan. Ide saya adalah untuk menonaktifkan semua tanggal di masa lalu (selesai) dan semua tanggal di masa depan (sekitar 15 hari dari sekarang ()). Di bagian tengah, saya akan memeriksa dokumentasi javascript pemilih tanggal untuk melihat cara menonaktifkan beberapa hari terbuka secara individual.
Marcos Buarque
1
ya, ada juga maxDate: api.jqueryui.com/datepicker/#option-maxDate
jonhattan
Terima kasih, untuk beberapa alasan, ketika saya melihat dokumentasi bidang date_popup saya tidak dapat menemukan informasi tentang opsi maxDate. Ini berfungsi untuk saya dan membatasi kalender hingga maksimal: '#datepicker_options' => array ('minDate' => 0, 'maxDate' => 30,),
Marcos Buarque
jonhattan, saya minta maaf untuk bertanya lagi. Saya menarik rambut saya mencoba menjalankan fungsi kustom. Saya telah menerapkan model Anda dan ini sangat bagus untuk saya. Tapi sekarang saya ingin menjalankan fungsi khusus untuk hanya mengizinkan tanggal tertentu. Saya melihat Anda telah menyarankan liburan sebagai latihan untuk pembaca ;-) Pembaca ini hampir gila mencoba menyelesaikan masalah ini. Jika itu bukan pekerjaan tambahan besar untuk Anda, apakah Anda keberatan memposting bagaimana Anda akan menyelesaikan ini? Jangan khawatir tentang detail, saya hanya perlu bantuan keseluruhan untuk melakukan panggilan ke customFunction (tanggal). Terima kasih!
Marcos Buarque
Marcos, saya telah memperbarui jawaban saya dengan contoh sederhana penggunaan fungsi khusus.
jonhattan
0

Saya telah menggunakan modul Pembatasan Tanggal. Ini memberikan dan opsi untuk membatasi tanggal pada sejumlah parameter seperti tanggal tetap, tanggal relatif, dll.

cchanana
sumber