CODEWITHSUNDEEP
angularfullcalendar
user3431182
user3431182

Reputation: 33

Adding Input to day cell in month view of FullCalendar

I'm trying to modify the FullCalendar month view so each day cell has an input element.

Here's my code:

(...)
dayRender: function (date, cell) {
          cell.append('<input type="number" style="margin-top: 60px; width: 30%; margin-left: 2px; z-index: 10; pointer-events: all!important">');
        }
(...)

So far, that input is showing but it doesn't focus on click. How would I go about making it focus?

As you can see, I tried seeting the pointer-events of the input to all, while setting the table pointer-events to none, but the result is the same.

Upvotes: 0

Views: 732

Answers (2)

unaipuelles
unaipuelles

Reputation: 11

I have been trying and it works handling the event of dayClick. So, when the day is clicked I manually focus the input. Here is the code:

dayClick: function() {
    $(this).find("input").focus();
}

Maybe is not the best solution but it works.

Upvotes: 1

NeuTronas
NeuTronas

Reputation: 273

I know it's probably a bit too late for you to answer this question but this can be fixed with simple CSS by adding higher z-index on calendar background:

 .fc-row .fc-bg {
    z-index: 5;
  }

I hope it helps for someone who was looking for the same problem.

Upvotes: 1

Related Questions