JQuery UI selectmenuで選択された項目の値をsubmitしたい

JQuery UIの「selectmenu」でリストが選択された後に、当該フォームのsubmitを試みております。
色々、見たのですが、解決できないので質問させて頂きます。

読み込んでいるのを以下に記述させて頂きます。

HTML
1<link href="js/jquery/jquery-ui.css" rel="stylesheet">
2<script src="js/jquery/external/jquery/jquery.js"></script>
3<script type="text/javascript" src="js/jquery/jquery-ui.js"></script>
4<script type="text/javascript" src="js/ui.tabs/jquery-ui-i18n.min.js"></script>

<HTML> ```HTML  <form id="from1" name="from1" method="post" action="#"> <select id="selectmenu" name="selectmenu"> <option value="1" selected="selected">A</option> <option value="2">B</option> <option value="3">C</option> </select> <input class="btn" id="set" type="submit" value="セット"> </form> ``` 上記のリストが変更されたときに、valueの値をsubmitしたいと考えており、以下を記述してみました（動いておりません）。

javascript
1<script type="text/javascript">
2$( "#selectmenu" ).selectmenu();
3$( "#selectmenu" ).change(function(){
4	$('#from1').submit();
5});
6</script>

上記ではうまく受け取ってくれません。
＜HTML>のボタン（id="set"）では受け取ってはくれるのですが、受け取った後に、リストが初期値「A」に戻ってしまいます。

今回の希望は、リストを選択した後に、submitが実行され、かつ、リストはそのままという状態と作りたいと考えております。

ご教授のほどよろしくお願い申し上げます。

行動規範の内容に同意します

回答2件

ベストアンサー

jQuery UI の change イベントは以下のような感じじゃなかったでしたっけ？

javascript
1$("#selectmen").selectmenu({
2  change: function() {
3    $("#from1").submit(); 
4  }
5});

選択値の復元は、POSTした値をサーバー側で、リクエストなりセッションなりのスコープに設定して
それを view 側で参照して、selected を再現するという方法になりますかね。

サーバー側の言語が何なのか分からないため何とも言えませんが、
サブミットしたいぐらいなのですから、何かサーバー側の処理があるでしょう。

投稿2016/03/23 04:41

root_jp

総合スコア4666

OY_hironet

2016/03/23 05:00

有難うございました。無事、動作が確認できました。

行動規範の内容に同意します

postで送ってるパラメータの内容をブラウザで取得するのは無理。
ボタンで動いてるように見えるのはselectionChangeイベント発生前だから初期値を表示してるにすぎません。
どうしてもというならformの「method="post"」の部分を「method="get"」に変えたうえで、画面初期表示時にlocation.searchの値からパラメータを取得し、その値を「selected」に設定するように変えないとあかんです。

投稿2016/03/23 04:24