入力テキストがあります:
<div><label wicket:for="name">Name</label><input type="text" wicket:id="name" /></div>
ここで、この入力テキストに何らかの値を追加する 2 つのボタンを追加する必要があります。どうすればこれを実装できますか?
このボタンを使用して、フォームを送信したくないだけで、入力rextの値を編集します
を使用し<input type="button">Click Me</input>
ます。
これらのボタンのonclick
イベントで、入力テキストを編集する JavaScript 関数を呼び出します。
フォーム全体を送信する必要はありません。入力フィールドのモデルを変更し、フィールドを AjaxRequestTarget に追加する onClick メソッドで AjaxButton を使用できます。ウィケットはサーバー上で実行されるため、少なくとも Ajax によるサーバー ラウンドトリップを伴わないことは、ウィケット メソッドを使用して行うのは困難です。もちろん、JavaScript でこれを行うこともできますが、それには改札は含まれません。
これは Wicket とは関係ありません。これは単純な Javascript です。このようなことができます
<div>
<label wicket:for="name">Name</label>
<input type="text" wicket:id="name" id="markupId"/>
<input type="button" value="Do something" onclick="javascript:editField();"/>
</div>
ページのどこか (または読み込まれたスクリプト ファイル) に次の Javascript を追加します。
function editField(){
document.getElementById("markupId").value = "My value";
}
のような Javascript フレームワークを使用する場合は、フレームワークを使用しJQuery
て関数を onclick イベントにバインドする必要があります (JavaScript で HTML が汚染されるのを防ぎます)。