-1

Got the following from the following. Unfortunately I could not make a comment because I have too few points. fullcalendar.js v4 - How to set html in title?

  eventRender: function(info) {
  info.el.querySelector('.fc-title').innerHTML = "<i>" + info.event.title + "</i>";
  }

When I tried the following, it works for month, week and day views. Unfortunately it does not work for list view. What did I do wrong?

ADyson
  • 57,178
  • 14
  • 51
  • 63
P.V.Anthony
  • 41
  • 6
  • 1
    "What did I do wrong?"... Did it occur to you that the appearance of a list view is quite different to the other views, and maybe you should take a look at the HTML used to create it, to see if that's different too? I guess you didn't inspect the HTML of a List View (using your browser's Developer Tools) to find out what element you could target instead. If you did, you'd have found HTML such as `Sales Meeting`. `fc-list-item-title` is probably a good class to target, therefore. – ADyson Mar 21 '20 at 22:53
  • 1
    You correct. I should have looked in more deeply. Thank you for the advice. – P.V.Anthony Mar 22 '20 at 07:33

1 Answers1

3

Thank you for the advice @ADyson.

Here is the working solution for me.

    if (info.el.querySelector('.fc-list-item-title') !== null){
      info.el.querySelector('.fc-list-item-title').innerHTML = "<span style=\"color:green;font-size:14px;\">Reading</span><br>";
    }

    if (info.el.querySelector('.fc-title') !== null){
      info.el.querySelector('.fc-title').innerHTML = "<span style=\"color:green;font-size:14px;\">Reading</span><br>";

    }
P.V.Anthony
  • 41
  • 6