Initiating Calls from JavaScript to JavaFX

I'm facing an issue while trying to execute a JavaScript function called testCheckMate from Java. The error message I receive is:

Exception in thread "JavaFX Application Thread" netscape.javascript.JSException: SyntaxError: Unexpected EOF

The WebView is currently displaying FullCalendar.

I need assistance on how to properly call JQuery/Javascript functions from within Java. Thank you all for your help.

<!DOCTYPE html>
<html>
    <head>
        <link href='../fullcalendar/fullcalendar.css' rel='stylesheet' />
        <link href='../fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
        <script src='../lib/jquery.min.js'></script>
        <script src='../lib/jquery-ui.custom.min.js'></script>
        <script src='../fullcalendar/fullcalendar.min.js'></script>
        <script>

            $(document).ready(function() {

                var date = new Date();
                var d = date.getDate();
                var m = date.getMonth();
                var y = date.getFullYear();

              $('#calendar').fullCalendar({
                        editable: true,

                    testCheckMate: function() {
                        alert("Check-Mate");
                    },

                    events: [
                        {
                            title: 'All Day Event',
                            start: new Date(y, m, 1)
                        },
                        {
                            id: 999,
                            title: 'Repeating Event',
                            start: new Date(y, m, d + 4, 16, 0),
                            allDay: false
                        }
                    ]
                });

            });

        </script>
    </head>
    <body>
        <div id='calendar'></div>
    </body>
</html>

Answer №1

It seems like you are looking to transfer data from JavaScript when a user interacts with items on a calendar.

To do this, start by assigning a different name to the JavaScript property instead of using the function's actual name eventClick, for example: myClick. Then, instantiate a new object of type JavaApp:

script.setMember("myClick", new JavaApp());

The class JavaApp should be public, and its method must be able to receive messages from JS (you can define multiple arguments):

public class JavaApp {

    public void javaApp(String title, String x, String y, String name) {
        System.out.println("Event Title: "+title+", Coordinates ("+x+", "+y+"), view Name: "+name);
    }
}

Lastly, within the eventClick function in JavaScript, utilize the previously sent JS property and its method to transmit the data to the Java side:

eventClick: function(calEvent, jsEvent, view) {

    myClick.javaApp(calEvent.title, jsEvent.pageX, jsEvent.pageY, view.name);

    // change the border color just for fun
    $(this).css('border-color', 'red');

};

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

The final value is always returned by jQuery's each method

Is there a way to prevent the .each() function from selecting the last value every time it runs? var items = ["item1", "item2", "item3"]; $("#list li").each(function() { var addedClass; if ($(this).hasClass("one")) { addedClass = "red"; } else ...

Make sure to query MySQL database to see if the data already exists, and if not, go ahead and insert it using PHP

I am encountering difficulties in writing PHP code to insert values into a MySQL database only if they do not already exist. I am transmitting an array from JavaScript to a PHP file using $.ajax with the POST method. Do I need to include an additional &a ...

What is the best way to modify the state of a particular element in an array when using useState in React?

In my Next.js application, I am using a useState hook to manage state. Here is how my initial state looks like: const [sampleData, setSampleData] = useState({ value1: '', value2: '', value3: [] }); To update the state ...

Clicking on only one element should trigger it

My HTML structure looks like this: <article> <overlay> <IMG> </overlay> <div class="wrapper"> </div> </article> <article> <overlay> <IMG> </overlay> <di ...

How to implement PayPal integration in PHP

I am currently working on integrating the paypal payment system into a website dedicated to pet adoption. Initially, I had a basic code structure that was functional. However, after making some modifications and additions to the code, it no longer redirect ...

Converting a JavaScript function to TypeScript with class-like variables inside: a step-by-step guide

During the process of converting a codebase to TypeScript, I encountered something unfamiliar. In particular, there are two functions with what appear to be class-like variables within them. The following function is one that caught my attention: const wai ...

Terminate the application as soon as it transitions to the background

Currently in the process of developing an application that navigates from MainActivity -> Fragment -> See Details Activity. Everything seems to be functioning properly. The issue arises when I switch to the background on the See Details Activity, a ...

Encountering a Mongoose error during the upsert operation with findOneAndUpdate

While attempting to upsert using findOneAndUpdate, I encountered an error. ValidatedCertificates.findOneAndUpdate( //query { "course": req.body.course_name, "batch": req.body.batch_name }, { //update ...

Enhancing an identity function with type hinting

I am looking to define a specification for a function that returns its input argument, regardless of its type. The crucial aspect here is to mirror the interface of the argument in the return value. For instance, when I type z. on line 6 as shown in the i ...

The program is failing to save to the next available space

The issue I'm facing involves managing two arrays that represent docking spaces for ships. In the first array, a ship object (with properties shipName and size, typically Super-Container) can be stored. If there is no available space in the first arra ...

Tips for Keeping a Responsive Image at the Forefront of a Text-Image Layout as You Scroll

I'm currently in the process of creating a website where text appears on the left side with an accompanying image on the right. The challenge I'm encountering is ensuring that as users scroll, the image adjusts dynamically based on the associated ...

Accessing my data on my personal server through firestore entails an extra step in the request process

If I were to set up Cloud Firestore on my personal server, wouldn't that create a "two-way trip" for accessing my data? What I find concerning is the fact that the client-side has to send a request to my server first, and then my server must reach ou ...

When using mongoose, is it possible to add a new item and retrieve the updated array in one endpoint?

My API endpoint for the post operation query using mongoose is not returning the updated array after adding a new item. I have been struggling with this issue for 3 days without any success. Any help would be greatly appreciated. router.post("/:spot ...

What could be causing my application to crash upon opening it for the second time?

After successfully installing my app on my device through Android Studio, I encounter an issue where the app crashes upon reopening. This problem persists even when creating a new project with similar code. Despite using simple code, I am unsure why this ...

An issue occurred during the execution of an AJAX call triggered by the onsubmit

When triggering a JavaScript function using the onSubmit event of a textfield, it looks like this: <form action="#" onsubmit="getTestResults()"> <input class="button2" type="text" name="barcode" > </form> The JavaScript function bein ...

Sequelize does not automatically include a junction table in the associated model data

Imagine having two models, User and Event, established in a many-to-many relationship with User.belongsToMany(Event) and Event.belongsToMany(User). Everything seems to be functioning properly until executing User.findAndCountAll({include: [{model: Event}]} ...

Simple methods for ensuring a minimum time interval between observable emittance

My RxJS observable is set to emit values at random intervals ranging from 0 to 1000ms. Is there a way to confirm that there is always a minimum gap of 200ms between each emission without skipping or dropping any values, while ensuring they are emitted in ...

stopPropagation() halts the propagation in the opposite direction

I encountered an issue while attempting to create a non-clickable div. While it does stop propagation, it doesn't prevent what should be stopped and allows things that shouldn't be clickable. js //screen has set stopPropagation $("#smokeScree ...

Using JavaScript to enhance and highlight specific items in a dropdown menu

I am looking for a solution to prevent duplicate selections in multiple select dropdowns. I want to alert the user if they have chosen the same value in more than one dropdown. Should I assign different IDs to each dropdown or is it possible to use just on ...

StyledTab element unable to receive To or component attributes

Is there a way to use tabs as links within a styled tab component? I've tried using the Tab component syntax with links, but it doesn't seem to work in this scenario: <Tab value="..." component={Link} to="/"> If I have ...