How to pass multiple arguments in a single Javascript method using thymeleaf onclick (th:onclick)

Question

I tried the following syntax but it didn't work for me. Please let me know the answer.

Javascript Code --->

function passValue(id, name){
        
        console.log(id)
        console.log(name)
    document.getElementById("updateId").value=id; 
        }

Thymeleaf code -->

<input type="button" th:onclick="passValue(\''+${data.id}+'\', \''+${data.newEntryName} +'\')" value="Update" />

It shows an error like:

SyntaxError: Unexpected Token.

Welcome to stackoverflow! Did you check the resulting HTML in your browser? How does it look like? Is there any exception in the logs? — Wim Deblauwe
– Wim Deblauwe, Commented Jan 25, 2022 at 7:31
Thank you, Wim; Yes, there it shows an error like; SyntaxError: Unexpected Token. — DILIP KUMAR
– DILIP KUMAR, Commented Jan 25, 2022 at 7:35

Metroids · Accepted Answer · 2022-01-25 16:07:07Z

1

I recommend you do JavaScript arguments like this (notice I'm using onclick and not th:onclick):

<input  type="button"
        th:data-id="${data.id}"
        th:data-name="${data.newEntryName}"
        onclick="passValue(this.getAttribute('data-id'), this.getAttribute('data-name'));"
        value="Update" />

answered Jan 25, 2022 at 16:07

Metroids

20.6k4 gold badges49 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to pass multiple arguments in a single Javascript method using thymeleaf onclick (th:onclick)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related