[FullCalendar 2] Capturing the Date selected in Calendar

Forge Component
(31)
Published on 2019-03-29 by Daniel Filipe
31 votes
Published on 2019-03-29 by Daniel Filipe

Hi Team,

we are trying to capture the date selected on the calendar(by clicking "<" and ">" buttons to select previous date or next date). 

Could you help us in capturing that date to a variable. 


Thanks

Srinivas Nalamati

Srinivas Nalamati wrote:

Hi Team,

we are trying to capture the date selected on the calendar(by clicking "<" and ">" buttons to select previous date or next date). 

Could you help us in capturing that date to a variable. 


Thanks

Srinivas Nalamati

Hi Srinivas,

You can use the events from the Full Calendar to get the value of the date that was selected by the user.

Please refer the screenshot below

Thank you,

Alefiya

Alefiya Ali wrote:

Srinivas Nalamati wrote:

Hi Team,

we are trying to capture the date selected on the calendar(by clicking "<" and ">" buttons to select previous date or next date). 

Could you help us in capturing that date to a variable. 


Thanks

Srinivas Nalamati

Hi Srinivas,

You can use the events from the Full Calendar to get the value of the date that was selected by the user.

Please refer the screenshot below

Thank you,

Alefiya

Hi 

Thanks for your reply. But the above aproach is not working.

could you suggest any other way to capture the date clicked on calendar.

Thanks

Srinivas Nalamati


we are trying to capture the date by clicking the "<",">" and "today" button.

Can anyone help us on this.

Thanks

Srinivas Nalamati

Hi ,

can anyone help on this?

Thanks

Srinivas Nalamati

Hello All,

I've archieved this requirement using the following Javascript. I'm putting this in an expression on the screen with the escape content.

$(document).on('click', '.fc-prev-button, .fc-next-button', function() {
    var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');

    $('#"+InputDefaultDate.Id+"').val(CustomDefaultDate);
    $('#"+HiddenButton2.Id+"').click();

});

Basically I got a hidden input where I'll get the value of the date and a button to make the assign to a variable and refresh the input. Let me know for further difficulties.

Regards,

Tiago Gomes

Tiago Gomes wrote:

Hello All,

I've archieved this requirement using the following Javascript. I'm putting this in an expression on the screen with the escape content.

$(document).on('click', '.fc-prev-button, .fc-next-button', function() {
    var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');

    $('#"+InputDefaultDate.Id+"').val(CustomDefaultDate);
    $('#"+HiddenButton2.Id+"').click();

});

Basically I got an hidden input where I'll get the value of the date and a button to make the assign to a variable and refresh the input. Let me know for further difficulties.

Regards,

Tiago Gomes

Hi Thanks for your reply.

As per your reply,

i have to create a hidden button on screen .

And where i have to place the above java script?

Thanks

Srinivas Nalamati


Hello,

Like I've described on the post above "I'm putting this in an expression on the screen with the escape content."

Thank you.

Tiago Gomes wrote:

Hello,

Like I've described on the post above "I'm putting this in an expression on the screen with the escape content."

Thank you.

Hi Gomes,

where i have to create InputDefaultDate and HiddenButton2 buttons?

thanks


Tiago Gomes wrote:

Hello,

Like I've described on the post above "I'm putting this in an expression on the screen with the escape content."

Thank you.

Hi ,

i am able to view the date in alert. but can you help in capturing that date to a local variable.


Thaks

Srinivas Nalamati


Hello again,

Basically to store that value in a local variable you need to put it into an input text in a first place which corresponds to this piece of code

    $('#"+InputDefaultDate.Id+"').val(CustomDefaultDate);

After you assign that value to the input text all you need to do refresh the input which corresponds to this part of the code.

    $('#"+HiddenButton2.Id+"').click();

Here it's some part of my screen:

Solution

Tiago Gomes wrote:

Hello again,

Basically to store that value in a local variable you need to put it into an input text in a first place which corresponds to this piece of code

    $('#"+InputDefaultDate.Id+"').val(CustomDefaultDate);

After you assign that value to the input text all you need to do refresh the input which corresponds to this part of the code.

    $('#"+HiddenButton2.Id+"').click();

Here it's some part of my screen:

Thank you .  its working.



Solution

Great! Good work! :)

Tiago Gomes wrote:

Hello All,

I've archieved this requirement using the following Javascript. I'm putting this in an expression on the screen with the escape content.

$(document).on('click', '.fc-prev-button, .fc-next-button', function() {
    var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');

    $('#"+InputDefaultDate.Id+"').val(CustomDefaultDate);
    $('#"+HiddenButton2.Id+"').click();

});

Basically I got a hidden input where I'll get the value of the date and a button to make the assign to a variable and refresh the input. Let me know for further difficulties.

Regards,

Tiago Gomes

Hi Gomes,

As prev and next buttons i have added the .fc-today-button also. But it is not working for today. 

Any specifically i need to add to work for "Today" as well?

Thanks

Srinivas Nalamati


Hi Srinivas,

For some reason adding the class of the button to my code above doesn't work. However with this one it will work:

$(".fc-today-button").click(function() {
    var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');
    alert(CustomDefaultDate);
});

Regards!

Tiago Gomes wrote:

Hi Srinivas,

For some reason adding the class of the button to my code above doesn't work. However with this one it will work:

$(".fc-today-button").click(function() {
    var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');
    alert(CustomDefaultDate);
});

Regards! 

Hi Gomes,

i tried the above one. But its not working.

Thanks


Srinivas Nalamati wrote:

Tiago Gomes wrote:

Hi Srinivas,

For some reason adding the class of the button to my code above doesn't work. However with this one it will work:

$(".fc-today-button").click(function() {
    var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');
    alert(CustomDefaultDate);
});

Regards! 

Hi Gomes,

i tried the above one. But its not working.

Thanks


Any other suggestions gomes


Thanks

Srinivas Nalamati


Can you check like this?

$( document ).ready(function() {

$(".fc-today-button").click(function() {
var CustomDefaultDate = OSFullCalendarInstance.calendar.state.dateProfile.activeRange.start;
    CustomDefaultDate = formatDate(CustomDefaultDate, 'dd/MM/yyyy');    $('#"+InputDefaultDate.Id+"').val(CustomDefaultDate);
    $('#"+HiddenButton2.Id+"').click();});
});