CODEWITHSUNDEEP
javajavascriptjquerywebviewjavafx
Program-Me-Rev
Program-Me-Rev

Reputation: 6624

How to call JavaScript from Java

I'm trying to call a JavaScript function testCheckMate from Java but I get error:

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

The WebView is holding FullCalendar.

How do I go about calling JQuery/ Javascript from Java? Thank you all in advance.

<!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>

Upvotes: 0

Views: 1321

Answers (1)

Jos&#233; Pereda
Jos&#233; Pereda

Reputation: 45456

If you want to add a function on the html file you could another <script> tag, or just use the one there, but out of the $(document).ready() jQuery block:

<script>

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

    $(document).ready(function() {
        $('#calendar').fullCalendar({
           ...
        });
    }); 
</script>

Or, as in this answer, you need to declare the name of the function up front:

<script>

    var testCheckMate;

    $(document).ready(function() {

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

        $('#calendar').fullCalendar({
           ...
        });
    }); 
</script>

Alternatively, as in this answer, you can create your function on the Java side, without the need to modify the html file:

private WebView webView;
private WebEngine engine;

private void createCalendar() {
    webView = new WebView();
    engine = webView.getEngine();
    engine.load("file:D:/standAloneDev//src/fc/fullcalendarwebview/fullcalendar-1.6.4/demos/selectable.html");

    engine.getLoadWorker().stateProperty().addListener((ov,oldState, newState)->{
        if(newState==State.SUCCEEDED){

            // JS to Java
            JSObject script = (JSObject) engine.executeScript("window");
            script.setMember("myClick", new JavaApp());

            // Java to JS
            engine.executeScript("function testCheckMate() {\n" +
                        "            alert(\"Check-Mate\");\n" +
                        "        };");
        }
    });

    engine.setOnAlert(e->System.out.println("Alert: "+e.getData()));
}

and call it on your app:

 @Override
public void start(Stage primaryStage) {
    Button btn=new Button("Call function");
    btn.setOnAction(e->{
         engine.executeScript("testCheckMate();");
    });
    Scene scene = new Scene(new VBox(webView,btn), 600, 400);

    primaryStage.setScene(scene);
    primaryStage.show();
}

In any case, note that the alert window won't be shown in your calendar, since it's trapped by the webView. The setOnAlert() method is used to get the notifications.

Upvotes: 2

Related Questions