Zembla
Zembla

Reputation: 371

how to change the parameter names "title", "start" and "end" in the fullcalendar jquery

In jquery's fullcalendar script I'd like to change the keywords "title" "start" and "end" by the column names that are in my database table.

the fullcalendar work when i change in the database table the name of the colums :

i changed "name" by "title" , "date_start" by "start and "date_end" by "end", ok it's work ,but I would like to do the opposite.

                        $(document).ready(function() {

                            var calendar = $('#calendar').fullCalendar({
                                editable: false,
                                events: "{{ route('products') }}",
                                displayEventTime: false,
                                eventRender: function(event, element, view) {
                                    if (event.allDay === 'true') {
                                        event.allDay = true;
                                    } else {
                                        event.allDay = false;
                                    }
                                },
                                eventClick: function(event) {

                                    $.getJSON("{{ route('products') }}", function(user) {
                                        var convertToTableau = Array.from(Object.values(user));
                                        console.log(convertToTableau);
                                        var us = $.grep(convertToTableau, function(v) {


                                            return v.id == event.id;
                                            console.log(event.id);

                                        });
                                        $("#firstname").text(us[0].title);
                                        $("#idpilote").text(" Id : " + us[0].id);
                                        $("#firstname").text(" Name : " + us[0].title);
                                        $("#metier").text(" Job : " + us[0].profession);
                                    });
                                }

                            });
                        });
                    </script> ```

Upvotes: 1

Views: 2677

Answers (1)

ADyson
ADyson

Reputation: 62078

You can't change what fullCalendar expects as the default property names for the important fields in your events (well, you could, if you modified the fullCalendar source code, but you don't want to do that).

However, if for some reason you don't want to change your server/database code to match (but why not, exactly??) you can create a simple mapping between the two via the eventDataTransform callback in fullCalendar. This function runs once for every event which is loaded into fullCalendar, and allows you to update the properties of the event object before fullCalendar starts processing it. In here you can copy data from the server-generated property names to the ones which fullCalendar recognises.

Here's an example:

eventDataTransform: function(event) {
  event.title = event.name;
  event.start = event.date_start;
  event.end = event.date_end;
  return event;
}

Upvotes: 5

Related Questions