2

I have this code:

$(document).ready(function () {
/*var event_list = $('#event_list');*//*gil70l*/
    //$(document).ready(function () {
    //
    $("#btnsearch").click(function () {
        var res = $("#txtSearch").val();
        res = res.substring(0,19);
        date = moment(res, "DD/MM/YYYY HH:mm");
        alert(date);
        $("#calendar").fullCalendar('gotoDate', date);
        $('.fc-day[data-date="' + date + '"]').css('background-color', "red");
        //$('#calendar').find('.fc-day-number[data-date="' + date + '"]').css('background-color', '#FAA732');
      
    })

but I cannot highlight the day on which I position myself with the function 'gotoDate'.

ADyson
  • 57,178
  • 14
  • 51
  • 63
ISO
  • 41
  • 5
  • Maybe this post can help you: https://stackoverflow.com/a/4191718/13604954 similar as **$(".fc-day").find('[data-date="' + date + '"]')** – Patfreeze Aug 24 '21 at 12:08
  • thanks, but i haven't found a solution to my problem – ISO Aug 24 '21 at 13:37
  • I also tried:$(".fc-day").find('[data-date="' + date + '"]').addClass("fc-highlight"); but nothing. – ISO Aug 24 '21 at 15:30
  • **$('.fc-day[data-date="' + date + '"]')** maybe return more than one elements. try to console.log() like this **console.log($('.fc-day[data-date="' + date + '"]'))** – Patfreeze Aug 24 '21 at 20:29

1 Answers1

1
$('.fc-day[data-date="' + date + '"]'

...in here you'd need to put the date in yyyy-mm-dd format, as this would match what you see if you look at the generated fullCalendar HTML and see what's there already. Currently you're letting momentJS use its default string format output which would look something like

 Wed Aug 25 2021 10:26:36 GMT+0100

I expect that

$('.fc-day[data-date="' + date.format("YYYY-MM-DD") + '"]'

will work better.

ADyson
  • 57,178
  • 14
  • 51
  • 63
  • Ok thanks, it works.But if I wanted to color the single event, how could I do? – ISO Aug 25 '21 at 10:56
  • I tried '$('.fc-event-dot[data-date="' + date.format("YYYY-MM-DD HH:mm:ss") + '"]').css('background-color', '#a31a5c');',but nothing – ISO Aug 25 '21 at 10:56
  • If you have a specific event you want to highlight, you can set its properties (including colour-related properties) by updating it through the fullCalendar API: https://fullcalendar.io/docs/v3/updateEvent . P.S. I ahve answered the question as you gave it, so please mark it as accepted and/or upvote it. If you have a different question, please make a new post to ask that separately - thanks :-) – ADyson Aug 25 '21 at 11:02
  • P.S. I've no idea where you got the `.fc-event-dot` bit from, that isn't a thing in fullCalendar 3, at least not by default anyway (and in later versions, it doesn't carry the date with it as a data attribute). Examining the generated HTML of fullCalendar would show you this, and remove any need for guesswork :-) – ADyson Aug 25 '21 at 11:06