2013-01-16 11 views
10

私は最初に検索しましたが、私はThymeleafを初めて使い、javascriptで素人だから紛らわしい答えが見つかりました。JavaScriptを使用せずにjavascriptに変える式:インライン

は、私はちょうど一種のJSPのように、JavaScriptの関数に変数式を渡す方法を知りたい:もちろん

<a href="#" onclick="javascript:getContactId('${contact.id}');">Button</a> 

、これはThymeleafで失敗し、文字列$ {contact.idを}の代わりに渡します変数式の値をどうやって得ることができるのでしょうか?

このようにしたい理由は、それがth:eachによって反復されている行に依存するからです。

th:inlineを使用する以外に他の方法がない場合は、上記の声明を考慮した最適なアプローチは何ですか?

答えて

27

この1つが働いた: http://forum.thymeleaf.org/variable-expression-into-javascript-without-using-th-inline-td4025534.html

th:onclick="'javascript:getContactId(\'' + ${contact.id} + '\');'" 

おかげでthymeleafフォーラムに出て行きます

+0

これは私のために、1つのパラメータで動作しますが、私は(まだ)2つのパラメータでどのように見えるか見ることができません? – demaniak

+0

ああ、気にしないでね!固定ストリングparamの場合、上記は 'th:onclick =" 'javascript:getContactId(\' someString \ '、\' '+ $ {contact.id} +' \ ');' "Cool 、ありがとう! – demaniak

0

javascript変数をonclickまたは他のDOM属性に入れることはできません。 onclickまたは他のDOM属性の値は定数文字列である必要があります。

ただし、動的にこのように、JavaScriptからのonclick属性の値を変更できます。

yourDomElement.onclick = anyVariable; 
+0

タグの部分は定数文字列である必要があります。動的にそれを内部から行うことができます

0

より一般的なアプローチで、あなたはイベントハンドラのパラメータとして渡されていませんJS何かに必要がある場合:

th:attr="data-myValueFromThymeleaf=${contact.id}"

名前がデータ - で始まるさによって無視されているすべての属性すべてのブラウザ。したがって、UIには影響しませんし、javascriptの値を簡単に読むことができます。

それはHTMLにJavaScriptコードを入れて理想的ではないので、私はあなたが何を意味

関連する問題