Using the JSTL c tag within a JavaScript function

Is there a way to integrate jquery fullcalendar with MySQL using Spring MVC? I need to fetch schedule data from MySQL and display it on the calendar. Can you please demonstrate how to do this?

<script type='text/javascript'>
            $(document).ready(function() {
                var calendar;
                var date = new Date();
                var y = date.getFullYear();
                var m = date.getMonth();
                var d = date.getDate();

                $('#calendar').fullCalendar({
                    header : {
                        left : 'title,prev,next today',
                        center : '',
                        right : 'month,agendaWeek,agendaDay' 
                    },
                    height: 650,
                    selectable: true,
                    select: function(start, end, allDay) {
                        var title = prompt('Event Title:');
                        if (title) {
                            calendar.fullCalendar('renderEvent',
                            {
                                title: title,
                                start: start,
                                allDay: allDay
                            },
                                    true // make the event "stick"
                                    );
                        }
                        calendar.fullCalendar('unselect');
                    },
                    editable : true,

                  events: [
                     <c:forEach var='event' items='${myData.events}'>
                         { title: '${event.title}', start: new Date (${event.timestamp}) },
                     </c:forEach>
      null // the trailling comma is  avoid the stray trailing comma.

    ];
                });

            });
        </script>

Do you think it's possible to achieve this integration? If so, could you please provide guidance on how to implement it? Additionally, in order to integrate fullcalendar with the database, is it necessary to use PHP feed, Json, and Ajax? Your assistance would be much appreciated.

Answer №1

One way to simplify your workflow is by incorporating a library like GSON

Within your controller, you can implement the following code:

    String jsonData = new Gson().toJson(eventList); // eventList is a list of event objects
    System.out.println(jsonData);
    request.setAttribute("eventsJson", jsonData); // setting the jsonData to the request scope.

Then, in your JSP file:

events: ${eventsJson}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Troubleshooting Problem with Creating a Button using HTML Checkbox "onclick" Event

My main goal with the checkbox click event is to achieve the following objectives: 1] Create a button with the id = 'id-of-checkbox'+'some-character-here' in a specific div. 2] Clicking on that button will remove both the button and ...

Error in Continuous Integration for Angular 4: Unable to access property 'x' of an undefined variable

i am trying to display some data on the form but encountering an error: TypeError: Cannot read property 'title' of undefined below is my component code : book:Book; getBook(){ var id = this.route.snapshot.params['id']; ...

Sending an array as a query string

I am trying to send an array to my server using jsonp. Here is an example of the JSON I want to pass: ["something","another_thing",4,{"iam" : "anobject"}] However, I am unsure about how to actually pass an array. I thought it might work like this: some ...

Seamless animation when collapsing element using angular and css exclusively

I am attempting to incorporate a collapsible feature into my application. Rather than relying on external libraries like jQuery, I want to exclusively utilize Angular. For demonstration purposes, I have created a very basic example here: http://jsfiddle.n ...

An effective method for selecting data within table rows using jQuery

I have a table with multiple rows that follow the same format: <tr role="row" class="even"> <td><input type="checkbox" id="valj4"></td> <td>Generell grupp</td> <td><a href="/Home/DeviceDetails?uuid=2b9fe5 ...

Is it possible to modify a library's Spring property placeholders?

Our team is currently transitioning our application to utilize only Spring-Boot application.properties files. Previously, we stored properties for each library/dependency in separate dedicated property files like res/environment/some-library-override.prope ...

Generating a bullet list from an array of objects

Looking to create an unordered list with vanilla JS, using an array of objects to populate the list. Struggling a bit on how to accomplish this. Here is my current code: let myObj = [ {name: "Harry Potter", author: "JK Rowling"}, {name: "Hunger Gam ...

Assign Attribute to a Different Data Transfer Object

I have a query regarding my nestjs project - is it possible to assign a value Attribute to another Dto? Specifically, I'm looking to assign idData to the id in IsUniqueValidator. I attempted the following code but it resulted in 'undefined&apos ...

Attach the Bootstrap-Vue modal to the application's template

I am implementing a custom modal using bootstrap-vue modal in my project on codesandbox. This is the template structure: <template> <b-button variant="link" class="btn-remove" @click="removeItemFromOrder(index)"> Remove item </b-bu ...

Modules failing to load in the System JS framework

Encountering a puzzling issue with System JS while experimenting with Angular 2. Initially, everything runs smoothly, but at random times, System JS struggles to locate modules... An error message pops up: GET http://localhost:9000/angular2/platform/bro ...

Converting JSON array with ES6 functions

I have a specific array format that needs to undergo transformation. { [ { "condition": "$and", "children": [ { "column": "Title", "comparison": "$eq", "columnValue& ...

Is there a way to seamlessly roll the camera using a button in ThreeJS alongside TrackballControls without causing any conflicts?

When working with ThreeJS, I encountered an issue with rotating the camera using a button. Here is the code snippet I used: camera = new THREE.PerspectiveCamera(...) function roll(angle) { const quaternion = new THREE.Quaternion(); const lookat = ...

Adding a PDF generated from an HTML div to an email using Java

I am looking for a solution to convert the contents of an HTML div tag into a PDF file while preserving its associated CSS. This is essential as I will be using Java on the back-end to send emails, and I need to attach the PDF with the CSS intact when send ...

implementing toggle functionality for an array of items in ReactJS

I have an array and I am trying to create a show/hide feature for each item based on toggling. When I click on one item, it should expand while simultaneously hiding the previously expanded item. Here is the code snippet I have been working on: class App e ...

Retrieving the selected value from an added dropdown list using jQuery

Could someone please guide me on how to retrieve the selected value from an appended select list using jQuery? Any assistance would be greatly appreciated. Thank you in advance. var wrapper1 = $(".column1"); array1 = ["sample1", "sample2", "sample3"]; ...

What is the functionality of the "async:false" setting in a jQuery AJAX request?

I understand the purpose and usage of {async:false} in jQuery AJAX requests. However, I am curious to know how this operates synchronously. What is the mechanism behind it? ...

Is it possible to synchronize Vue data values with global store state values?

I need help updating my data values with values from store.js. Whenever I try the code below, I keep getting a blank page error. Here's how I have it set up in App.vue: data() { return { storeState: store.state, Counter: this.storeState.C ...

What is the best way to show a message on a webpage after a user inputs a value into a textbox using

I have a JSFiddle with some code. There is a textbox in a table and I want to check if the user inserts 3000, then display a message saying "Yes, you are correct." Here is my jQuery code: $("#text10").keyup(function(){ $("#text10").blur(); ...

Error: selenium web driver java cannot locate tinyMCE

driver.switchTo().frame("tinymce_iframe"); String script="var editor=tinyMCE.get('tinymce_textarea');"; JavascriptExecutor js=(JavascriptExecutor) driver; js.executeScript(script); I'm encountering a WebDriverException while try ...

Discover the steps to download web page data using Objective-C while ensuring that JavaScript has finished executing

I attempted something similar: NSString *url = @"http://www.example.com"; NSURL *urlRequest = [NSURL URLWithString:url]; NSError *error = nil; NSString *htmlContent = [NSString stringWithContentsOfURL:urlrequest encoding:NSUTF8StringEncoding error:&e ...