[Gelöst] Datepicker views css and jquery

[Author]

Artikel

[oriolc]

Hi,
I'm trying to make some jquery changes to my datepicker.

I you go to my site: versteckter Link you'll find a filter with a datepicker.
I would like my datepicker calendar always appears. I've been trying different options as datepicker show method, but it doesn't work. I think I can't not find the right id. Can you help me?

I have another question: There is a way de calendar datepicker have a position relative and not to have the position absolute that has now? There is a way to put the datepicker calendar after the calendar icon? If we use the jquery ui documentantion it's easy to do it, but toolset put the calendar code before the body and I can't find a method to do it.

Thanks in advance,
Jordi

[Waqar]

Hi Jordi,

Thank you for contacting us and I'd be happy to assist.

I'm afraid, there is no built-in filter or hook available to achieve this, so this will require a fair deal of customization.

Although, 1-1 customization of this scale is beyond the scope of support of that can be provided over the forum, we do our best to guide in the right direction, whenever possible.

1. To show an inline datepicker, you can place a special div with some ID, for example in your search form:
( ref: versteckter Link )

<div id="datepicker"></div>

2. After, that you can use "onSelect" option to get the selected date from this inline datepicker, for example:
( ref: versteckter Link )

jQuery( function() {
	jQuery('#datepicker').datepicker({
		onSelect: function (dateText, inst) {
			console.log(dateText);
			console.log(inst);
		}
	});
});

3. By default, the Toolset's original datepicker in the search form, uses a hidden input field with name format "wpv-wpcf-{field-slug}" to store the selected date in the UNIX timestamp format. Your last challenge would be to convert the date selected through the inline datepicker into UNIX timestamp format and then add it as a value in that hidden input field.

This way, when the search form will be submitted, the correct value selected through the inline datepicker will be used.

I hope these pointers will help.

regards,
Waqar