• pdr

    (@philricebolivia)


    I would like to display the jquery calendar as a full calendar and not just when you click the input box . The jquery docs say you simply call the datepicker instance in a div but I cannot work our how to change the PPOM input field so that it works that way.
    Jquery page that I am referring to https://jqueryui.com/datepicker/#inline

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter pdr

    (@philricebolivia)

    also – how to change the calendar so that I can disable certain days / dates?

    the following code works for a standard usage of jqueryui calendar :
    var disabledDates = [“2018-11-28″,”2018-11-14″,”2018-11-21”]

    $(‘input’).datepicker({
    beforeShowDay: function(date){
    var string = jQuery.datepicker.formatDate(‘yy-mm-dd’, date);
    return [ disabledDates.indexOf(string) == -1 ]
    }
    });

    but I cant work out how the PPOM implementation sets it up exactly.

    Ultimately I want to be able to control the disabling of dates from the product edit page , so someone can add dates, or date ranges, or days (so that just say Wed and Sat are avaialble as choices).

    N-Media

    (@nmedia)

    Hi,

    Sorry inline calendar is not yet supported in PPOM and to disable certain dates you can make changes in input.js file under ‘date’ section.

    Thread Starter pdr

    (@philricebolivia)

    Thanks for getting back to me. Thats a pity , I will have to implement the calendar myself instead I think as it is something I really require. I have purchase PPOM pro already but I will need its functions for other things im doing anyway so its not going to waste – great plugin btw!.

    Yes , I have worked out the disabling dates parts and I have JS pulling a list of dates input into a custom field that is set to be a hidden field on the page and that is working fine. The one thing Im yet to work out is how to have a separate field that has a list of days that will always be disabled (Like say Mondays and Thursday always disabled) and have that working in addition to the individual dates. Ive not spent too long on that yet but if you have any ideas / pointers that would help it would be great.

    N-Media

    (@nmedia)

    Ok, one you can do, is to replace html of date input all the way using following filter:

    return apply_filters("nmforms_input_html", $html, $args, $default_value);

    near line 187 in file inc/nmInput.class.php

    Here you can check the if($args['type'] == 'date')) then add your html which can get an idea from existing html being generated above this filter. I hope you will do this.

    Thread Starter pdr

    (@philricebolivia)

    I worked the disabling the days part out :

    added a custom field for admin in the input using numbers 0 to 6 and published that as a hidden field on the page
    created a function and used jquery to pull the hidden field data into an array and used a for loop to go through the array changing all but the last one to
    daysarray[i] = "day != "+daysarray[i]+" && "; and the last array entry the same without the &&
    then I returned daysarray.join(“”) as a string using eval

    For the disabledDates part i do the same with a hidden field but then just use tha hidden field value as it needs less formatting and then in ppom.inputs.js in the case:date section that formats the datepicker I use the following return statement

    return disabledDates.indexOf(string) != -1 ? [false] : disabledDays;

    I think it might be a good idea to consider adding the above functionality into the pro version at some point – im sure you can come up with a better, cleaner way than me of course! I just posted the info incase it helps someone else.

    I will work on the open calendar display today using your tips – a brief look at it and it looks like I can work out it.
    Thanks

    N-Media

    (@nmedia)

    Hi,

    Ok sure I will add some option in future to configure dates.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘displaying jqueryui calendar as calendar not input’ is closed to new replies.