Hi, can you try loading momentjs and caleran.min.js into the head section of your document?

Done! Caleran.min.js and moment.min.js put on HEAD in every site

There’s a problem on the page, it can’t find caleran.. I suppose there’s a problem with something else. Can you remove the second jQuery just before the caleran initialization script?

Hi, you can set the startDate and endDate to whatever you want to be initially selected. Or you can set caleran.globals.currentDate to set the initial month.

I am using the singleDate option for the datepicker

Ok you can use startDate then.

Hi sterotondo, it is for html. How do you think it can be used for wordpress? I might prepare one.

it is good for me

Please don’t share urls here. Send it to my email. You can send it via my profile contact box. Delete the file you shared. BTW, the file can’t be opened.

Last update fixed all issues and added new features I needed. Thank you very much!

You’re welcome

Hi mercaservi,

I pushed a fix today, when it get’s approved, you’ll get a notification about it. You can download and test it after that. I hope it solves the DST issues, it passed all the automated tests, but there might be some missing cases. If you encounter one, please let me know.

Hello tpaksu, It seems that the fix has solved the problem, now it works perfectly. Thank you!

You’re welcome. And thanks for letting me know.

Hi TWDS2011,

I pushed a fix today, when it get’s approved, you’ll get a notification about it. You can download and test it after that. I hope it solves the DST issues, it passed all the automated tests, but there might be some missing cases. If you encounter one, please let me know.

HI tpaksu,

Yes I just downloaded your updated fix – and all is working fine now with no issues. Thank you for your help on this matter!

Much appreciated & great project. Thank you.

You’re welcome. Thank you for using it.

Normally, the code I provided would solve your problem, but you are having issues by using minDate and maxDate, try using disabledDays to disable the dates before minDate, and then use the ”.caleran-day.caleran-disabled” combo class to make them hidden. I’ll prepare a demo to check if it’ll work.

Yep it doesn’t work, but there’s a solution.

1st step: on line 1121, there’s this line in addDisabledStyles method:
cellStyle += " caleran-disabled";
replace it with
cellStyle += " caleran-disabled caleran-not-in-month";

2nd step make the “else if” -> “if” surrounding that code.
3rd step replace the ”.caleran-disabled.caleran-day” css with ”.caleran-not-in-month” selector.

The last code piece will look like this:

Thank you

Yes, the same parameter also works with inline view option. There isn’t any example with that in the documentation but it works.

Do you have a documentation that allows you to do it with code.

Hi you can read the changelog file or the header of the javascript file to see what changed

Hi layum, I pushed an update to envato now, it’ll be available once it gets approved. Can you check my other plugins live preview’s if they also have the same problem?

Hi layum, did you download the last update? Did you have time to check that it’s fixed and not broken something else?

Hi layum,

I pushed a fix today, when it get’s approved, you’ll get a notification about it. You can download and test it after that. I hope it solves the DST issues, it passed all the automated tests, but there might be some missing cases. If you encounter one, please let me know.

you can add “caleran.reDrawCalendars()” after updating the input.

works great, thanks!

You’re welcome.

Thank you! It works now! Do you think, you will implent this for the next release?

Yep, I pushed it to codecanyon with more updates and it’s waiting for approval right now.

If you want the release earlier, send me a message via my profile contact form.

I didn’t see the clumsiness on google chrome but yes you’re right, samsung internet browser has some CSS issues related to flex boxes. I’ll note this and fix it on the next release. Thank you.

Is this the only option? This approach seems really error prone.

I really think that these are some critical features to consider for future releases because getters and setters are fundamental API methods for JS editor components such as dropdowns, selects and datepickers. Your plugin is really great – it already has a nice API exposed, has great compatibility for browsers and devices, however the aforementioned are a must.

On the other hand, given the circumstances, what do ‘startDate’ and ‘endDate’ do anyway?

It’s not the only option, you need to call updateInput(false) after you set startDate and endDate. The way that I proposed is also running the validation routine on opening the dropdown and returns to empty state if it doesn’t have the required format. But it’s the easiest one.

Look at this example:

it sets the startDate and minDate, and then updates the input to ensure there are no difference between the input value and the configured dates.

Hi mcbrshishov,

Nope, its a completely valid question. You can read it in three ways:

1. Reading the input value that you’ve attached the caleran instance
2. Reading caleran.config.startDate and caleran.config.endDate variables, which you can access the caleran object with $(input).data("caleran")
3. Or by filling the onafterselect event and reading from there:

Hi, Can you try setting the format to “DDDD-MM-YY beneath those? And you have a typo when defining maxDate, you have a before the property name.

in the question I was wrong, it was max date, but it works now “maxDate: ‘2017-10-18’}”

Glad it worked.

Tpaksu, thanks for the sample. The end date picker was working very much how i wanted both to function so I got it working the way i had hoped with this..

$("#caleran-ex-4, #caleran-ex-5").caleran({
          target: $("#caleran-ex-6"),
          startEmpty: true,
          minDate: moment(),
          autoCloseOnSelect: true,
          showFooter: false,
          onfirstselect: function(caleran, start){
              $("#caleran-ex-4").val(start.format(caleran.config.format));
          },
          onafterselect: function(caleran, start, end){
              $("#caleran-ex-4").val(start.format(caleran.config.format));
              $("#caleran-ex-5").val(end.format(caleran.config.format));
          }
      });

Also of note the “caleran.hideDropdown();” function does not appear to work on the latest versions of Firefox or Firefox Developer Edition (OSX)

c is undefined : caleran.min.js:1:21100

hidedropdown needs an event parameter to work, you can pass new Event() inside the method.