私はどちらの技術にもあまり詳しくありませんので、ご容赦ください。JSP ページに一連のラジオ ボタンがあります。それらは 1 ~ 5 で評価されます。その新しい評価をデータベースに更新したいと思います。「onselect」イベントを何らかの形で利用する必要があることはわかっていますが、役立つものは何も見つかりませんでした。誰もこれを達成する方法について考えを持っていますか? ありがとうございました。
3 に答える
それがフォームではないと仮定すると:
- JavaScriptで変更を検出する
- サーバーサイドスクリプトに投稿する
- おそらくそれを処理してデータベースを更新します
タグにspring-mvcを含めたので、クライアント側からサーバーへの情報の送信についてさらに情報が必要だと思います。
JSPと標準フォームを使用している場合、Springで「commandName」と「method」をコントローラーに一致させると、コントローラーはフォームを介して送信されたパラメーターをキャッチします。
<form id="form" commandName="interceptedPath" method="post">
<input id="rating1" type="radio" name="rating" value="1" checked><label for="rating1">1</label>
<input id="rating2" type="radio" name="rating" value="2"><label for="rating2">2</label>
<input id="rating3" type="radio" name="rating" value="3"><label for="rating3">3</label>
<input id="rating4" type="radio" name="rating" value="4"><label for="rating4">4</label>
<input id="rating5" type="radio" name="rating" value="5"><label for="rating5">5</label>
</form>
@RequestMapping(value = "/interceptedPath/", method = RequestMethod.POST)
public String submit(Model model, HttpServletRequest request) {
Map<String, String[]> parameterMap = request.getParameterMap();
String[] strings = parameterMap.get("rating")
return "detailedCalc";
}
Ajax呼び出しのように動的なことをしているのでない限り、JavaScriptは必要ありません。Javascriptを使用することにした場合は、jQueryライブラリ を使用することをお勧めします。
$(document).ready(function () {
$("form").submit(function () {
$.post('/spring/locationOfAjaxController', $(this).serialize(),
function (data) {
}
}
}
上記のコードの場合、ドキュメントがクライアントにロードされた後。「form」オブジェクトに対するすべての「submit」アクションをキャッチするイベントが作成されます(フォームのIDは「form」であることに注意してください)。それが発生すると、jQueryは指定されたURLにPOSTを送信します。$(this).serialize()
フォームデータをJSONにシリアル化します。これは、サーバーで処理する必要があります。
changeを使用して何かを実行したい場合は、このリファレンスを参照してください。
mavenアーキタイプを使用したspring-mvc(jsなし)の優れた例を見つけることができますorg.fluttercode.knappsack:spring-mvc-jpa-demo-archetype
。これにより、spring-mvcがすでにセットアップされ、準備ができている基本的なプロジェクトが生成されます。
最善のオプションは、を使用して、タグonchange
を読み取る関数に設定することです。select
関数は次のようになります。
function ratingChange(ele){
var opt = sel.options[sel.selectedIndex].value;
var txt = sel.options[sel.selectedIndex].text;
//process values and test
//assuming the form is not submitting use AJAX
}
そのonchange
場合、は次のようになります。
<select name="rating" onchange="ratingChange(this)">