I would like to mirror the available dates of the current product line item depending on the availability calendar of that specific product. The availability calendar is what the owner/admin of that product will fill up.

enter image description here

Then there is another date field that is on the line item (add to cart) of that product that will allow the customer to choose when to use/get/rent that certain product.

As you can see on the availability calendar, the 19th, 21th, 23rd, 26th, and 28th of Feb are fully booked. I want the same dates on the popup calendar to be disabled.

How can I achieve that?

These are modules I already tried:

  • Rooms - This is not fit for our website because of the forms/steps we are using.
  • Commerce Availability - This is exactly what I wanted but it's not working on my end. The date is still bookable on the line item even though my availability calendar is already fully booked. I already followed the instructions and fixed the settings of the module.

I also checked the demo of the Easy Booking, I had to guess which date is not available, which is not also good.

Thank you for the help in advance!

  • Are you wanting the availability to show up in the add to cart form when a customer is purchasing the product?
    – nvahalik
    Feb 16, 2016 at 12:34
  • Yes, the date popup calendar line item is on the add to cart form.
    – Danz
    Feb 17, 2016 at 2:09
  • What module are you using to create the above availability calendars?
    – nvahalik
    Feb 17, 2016 at 2:56
  • As of now just the module Availability Calendars itself, and a date module for the popup calendar. The same requirements for Commerce Availability module. I also tried using the availability calendar formlet but it's not integrated to the add to cart form.
    – Danz
    Feb 17, 2016 at 3:02

1 Answer 1


Unfortunately, there is not a particular bit of code that can be shared to fix your situation. But take heart! You're using libraries that are designed to be changed before display. That means with a little bit of custom php and javascript you can do this.

  1. First you need to determine how to change your widget

Using Javascript: https://stackoverflow.com/questions/9742289/jquery-ui-date-picker-disabling-specific-dates

Using Drupal to send variables to Javascript: how to send variable from .php file to .js file?

  1. Next you need to determine where your availability dates are stored

This is probably the most abstract issue. It sounds like you're storing the availability from within the node. I recommend you use the devel module and try to $node = node_load(123); dpm($node); to see what the availability field array looks like. We will do this in the next step. (Lynda series on the devel module)

  1. Finally, you need to connect both your knowledge of how to tweak the calendar and where the availability is stored with your line item form.

Fortunately, this is quite straightforward. Unfortunately, it's not complete and will need a fair amount of trial and error to get to a working solution. Welcome to learning the hard way :)


 * Implements hook_form_alter()
function MODULE_form_alter(&$form, &$form_state, $form_id) {
  // Avoid bundle cart forms and other forms
  if (strpos($form_id, 'commerce_cart_add_to_cart_form_') === 0) {
    $current_node = menu_get_object();
    // view the current node structure for your availability
    // view the current product's form array
    // you may not actually need to change the form here, but
    // I anticipate you needing to attach a javascript snippet to the
    // form so that it gets run each time the ajax loads a new
    // product

    // add your js to the php form
    $js_settings = "js array for your availability?";
    $form['#attached']['js'][] = array(
      'data' => array('module' => $js_settings),
      'type' => 'setting',

  • Thank you very much for the info! As of now I'm using both availability calendar and the availability calendar formlet, I connected both of it to the product then I created a textfield (selected date) on the product line item (add to cart form) instead of using the date popup calendar, and I used jquery to autofill the textfield (selected date) on the line item from the value of the availability calendar formlet. I get to choose the available dates from the availability calendar itself. BUT I will also try what you suggested to get what I really want. Your info is very helpful.
    – Danz
    Feb 18, 2016 at 3:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.