• 締切済み

jQueryでセレクトボックスの制御

自身のウェブサイト上のhtmlファイル内に複数選択型のセレクトボックスを、<select multiple="multiple">以下に<option value="XXX">を通し番号をつけて並列することで実装したとします。 jQueryにて例えば var a= [001, 003, 042]; といったように配列aを定義したときこの配列の中の要素(3桁の数字)に対応するようなvalueをもつoption(選択肢)をselectedに書き換えたいのですが初学者のためどうもさっぱりうまく行きません。 1.配列aをoptionタグのvalueの値であるとjQuery側に認識させる方法 2.jQueryによって配列に対応するvalueを持つoptionをselectedに書き換える方法 以上の2点について教えていただきたく思います。(説明が下手で申し訳ないです。) 配列を使わなくてももっと簡単な方法があるのかもしれませんが、諸事情によりなんとか配列を用いて実装できたらと思います。よろしくお願いします。

みんなの回答

  • sanzero
  • ベストアンサー率56% (58/102)
回答No.2

0から始まる連番ならば $.each(a, function(index, value){ $('select > option').eq(1 * value).prop('selected', true); }); 配列の中身の数値番目のoptionをセレクトするという処理を書きます。 別に連番でない場合は $('select > option').each(function(){ if ($.inArray($(this).val(), a) > -1) { $(this).prop('selected', true); } }); eachでoptionをなめます。 inArrayを使って比較します。 もしあればセレクトします。 ※三桁の数字は文字列として扱わないといけないので配列の中身はそれぞれクォーテーションで囲ってください。 検証してませんがこんな感じでどうでしょう。

  • pringlez
  • ベストアンサー率36% (598/1630)
回答No.1

日本語がところどころよくわからないところがありますが…。 >1.配列aをoptionタグのvalueの値であるとjQuery側に認識させる方法 >2.jQueryによって配列に対応するvalueを持つoptionをselectedに書き換える方法 とりあえず質問への回答として、あなたがやりたいことを実現するには $("【セレクタ】").val(a); と書けばいいだけです。 ※「【セレクタ】」の部分はあなたのソース内容に応じて書き換えてください。 ただ、その前に var a= [001, 003, 042]; この配列がおかしいです。以下に書き換えてください。 var a= ["001", "003", "042"]; プログラミングがはじめてとのことのようですから仕方がないかもしれませんが、型を正しく記述することはとても大切なことなので、jQueryに手をつける前にJavaScriptの基礎をもう少し勉強したほうがいいですよ。 クォーテーションなしで書いたら数値になりますし、001とか042と書いてしまうと8進数の意味になります。 ですので var a= [001, 003, 042]; は var a= [1, 3, 34]; という値であることになります。

関連するQ&A

  • jquery での <select multiple="true" > について

    jquery (ver1.2.6) で、<select multiple="true"> 内の option を、 全て selected 状態にする方法がわかりません。 単純な <select> タグであれば、 $("select").val("hogehoge"); のように、value にセットすれば選択状態になるみたいなのですが、 multiple の場合はどのように行うのでしょうか。 試しに記述してみたソースは以下のようなものなのですが、 動作いたしません、、 $('#selecttest').each(function() { $(this).attr('selected', 'selected'); }); もしよろしければ、コードまたは参考URLを教えていただけないでしょうか。 よろしくお願いいたします。

  • Jquery セレクトボックス追加

    現在jqueryにて、セレクトボックスchangeの値でセレクトボックスを追加するというものを作っています。 わからない点がいくつかあり、ご質問させていただきました。 <select name="num" id="num"> <option value="1">A</option> <option value="2">B</option> <option value="3">C</option> <option value="4">D</option> <option value="5">E</option> </select> というselectboxがあったときに、changeイベントで常に値をとっています。 $('#num').change(function(){ var numTotal = eval($('#num :selected').val()); $('#num1 > select').remove(); for(i = 1; i <= numTotal; i++) { $('#num1').append($('<select name="num1['+ i +']" class="num1">')); for(no = 1; no <= 99; num++) { $('#num1').append('<option value="'+ no +'">'+ no +'</option>'); } $('#num1').append($('</select>')); } }); と記述をしているのですが、 numで5を選択すると5個分selectboxは表示されます。 ですが、optionをnoで回しているとnumで選択した数ぶんループしています。 またnumでの値で表示されたslectbox(num1)2つめ以降から様子が変わり、noのループ数が1つずつ減っていきます。 例:numで5を選択 num1[0]では99までの数字が5回表示され、num1[1]だと99までの数字が4回表示され、num[2]だと99までの数字が3回表示されてしまいます。 これを正常に各num1[0]、num1[1]は99までの数字を1回のみに表示させるにはどうしたらよいでしょうか? 悩んでしまったため、投稿させていただきました。 どなたかご教授いただけないでしょうか?

  • PHPのセレクトボックスの初期値について

    phpのセレクトボックスの値を配列で指定したのですが初期値の表示がうまくいきません。 以下は現在のソースです。 $start_time[$j]はDBの取得値で取得配列と表示配列が一致するものを初期表示する というコードが以下になります $time_array = array( "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23" ); for( $a=0; $a < count( $time_array ); $a++){ $selectedStartTime =($time_array[$a] == $start_time[$j])?" selected":""; $startTimeSelectBox .= "\t<option value=\"{$time_array[$a]}\"{$selectedStartTime}>{$time_array[$a]}</option>\n"; } 疑問点ですが別条件で(たとえば$start_time[$j]にデータが0の時)配列の指定した値を選択したいです。 下記のようにそれぞれのvalue値の時に条件を指定すればできるのですが配列の時には どのように初期値を設定すればいいかわかりません。        <option value="0" <?php if($start_time[$j] == "0") { echo "selected"; } ?>> 0 <option value="1" <?php if($start_time[$j] == "1") { echo "selected"; } ?>> 1</option> <option value="2" <?php if($start_time[$j] == "2") { echo "selected"; } ?>> 2</option>         ・         ・         ・         ・ 条件を指定したときに初期値を設定したいです。どのように実装すればいいでしょうか。 よろしくいお願いします。

    • ベストアンサー
    • PHP
  • 2つのセレクトボックスで選ばれた結果をショッピングカートに渡したい

    同一ページ内に次の様な2つのセレクトボックスが有ります。 それぞれ選択された内容を足してショッピングカートに送りたいのですがどうしたら良いのでしょうか? セレクトボックス1 <option value="aaa">aaa</option> <option value="bbb">bbb</option> <option value="ccc" selected="selected">ccc</option> セレクトボックス2 <option value="100">100</option> <option value="200">200</option> <option value="300" selected="selected">300</option> ●セレクトボックス1→aaaを選択  セレクトボックス2→100を選択  ショッピングカートには「aaa100」で渡す ●セレクトボックス1→cccを選択  セレクトボックス2→200を選択  ショッピングカートには「ccc200」で渡す 全くの初心者ですがよろしくお願いします。

  • phpのセレクトボックスの配列について

    お世話になっています。 PHPのセレクトボックスの設定でわからないことがあります。 一度質問させていただいたのですが連なる点でわからないとこが出たので質問させていただきます。 不明点は3つあります。 1.セレクトボックスの値を配列で設定する 配列で設定しておけばその配列を複数使用しても参照配列さえメンテすればいいと思うので配列を想定しています 2.配列で設定したときのセレクトボックスの初期値について セレクトボックスの値をベタ書きしている場合は単にselectedすればいいと思うのですが配列の場合厳密なselectedの方法が不明です 3.配列での選択値をPOSTした場合 3つめが最もはまっています以下のソースだと選択値が配列の値が表示されますし、初期値も表示できていますが POSTした値がまともに渡されていません POST先でDB処理を想定しているのですがdate型だとすべて[00:00:00]になってしまいます。 配列を使用しないパターンだと1.2.3全てうまくいくのですがメンテナンスがしづらいので配列で指定したいです 何か、良い方法があればご教授ください //配列の値 $time = array( "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23" ); $minute = array ("00", "15", "30", "45"); for( $a=0; $a < count( $time_array ); $a++){ $selectedStartTime =($time_array[$a] == $start_time[$j])?" selected":""; $startTimeSelectBox .= "\t<option value=\"{$time_array[$a]}\"{$selectedStartTime}>{$time_array[$a]}</option>\n"; } for($a=0; $a < count($minute_array); $a++){ $selectedStartMinute =($start_minute[$j] == $minute_array[$a])?" selected":""; $startMinuteSelectBox .="\<option value=\"{$minute_array[$a]} \"{$selectedStartMinute}>{$minute_array[$a]}</option>\n"; } <td><select name="start_time<?php echo $day ?>" onblur = "func()"> <?php echo $startTimeSelectBox ?> </select> : <select name="start_minute<?php echo $day ?>" onblur = "func()"> <?php echo $startMinuteSelectBox ?> </select> </td> かなり詰まっています。よろしくお願いします。

    • ベストアンサー
    • PHP
  • セレクトボックスの選択項目を変える

    セレクトボックスの選択項目を変えるには どうすればいいですか? <FORM action=./ method=post> <SELECT name=server> <OPTION value=2 selected>2</OPTION> <OPTION value=3>3</OPTION> <OPTION value=4>4</OPTION> </SELECT> </FORM> こういうフォーム(FORMやOPTIONにnameがない)で [4]を選択したいです このフォームを書き換えないで(スクリプトでの書き換えなら○) どうにか変えることはできないでしょうか? IEのみの対応でいいので、お願いします

  • javascriptでセレクトボックスを動的に

    javascriptでセレクトボックスの"selected"を動的に変更する方法を教えてください>< 下記のselectedを"10"から"50"に変更したいのですが、 某ASPサービスの環境下での作業のため制約があり直接変更できません。 <body onload="event"> <select name="select"> <option value="10" selected="selected">10件</option> <option value="30">30件</option> <option value="50">50件</option> </select> そこで、JavaScriptで何とかしようと思うのですが、 <select>~ </select>の間(selectタグ含む)は、ASPサービスの制約でIDやclassを入れることもできず、 変更できるのは、body開始タグ部分、headerタグ内、body内(一部)です。 ページを読み込んだ際に、「50件を選択」、「10件からselected外す」状態にしたいです。 いろいろサイトを見てなんとなくできそうな気はするのですが、 スキル的に初心者レベルのため、わかりませんでした。 何卒よろしくお願いします!

  • PHP セレクトボックスの値 GET渡し

    PHP初心者です。 大急ぎで対応を要求されていますので皆様のお力添えをよろしくおねがいします。 画面に検索キーとしてのセレクトボックスがあります。 ボタンではなくリンクのonClickで選択された値をGETで渡したいのです。 どのように記述したらよいか教えてください。 検索キーのリストボックス(2012を選択した状態です) <select name="search_orderyear"> <option value="2005" label="2005">2005</option> <option value="2006" label="2006">2006</option> <option value="2007" label="2007">2007</option> <option value="2008" label="2008">2008</option> <option value="2009" label="2009">2009</option> <option value="2010" label="2010">2010</option> <option value="2011" label="2011">2011</option> <option selected="selected" value="2012" label="2012">2012</option> </select> 渡す値をセットしている箇所(xxxは外部function名です) onClick="xxx('pdf.php?orderyear=<!--{$search_ordermonth.value}-->',・・以下省略 としてみましたが、値はわたりませんでした。 上記説明で不足部分があればご指摘ください。 よろしくおねがいいたします。 PHP 5.2.9

    • ベストアンサー
    • PHP
  • phpでのセレクトボックスの値を配列で指定

    セレクトボックスの値をループで繰り返してvalueを設定しているのですがvalueの数が多くなればかなり見づらく 修正もしにくいのでvalue値を配列などで指定したいと思っています。 その場合、どのようにしてvalue値に配列を設定すればよろしいのでしょうか。 また配列でvalueを設定した場合[selected]などで初期値を設定する方法も分からなかったので 何かわかりやすくかつ少ない行数で胥吏できる方法があればご教授お願いします。 <?php for ($data = 1; $data < 5; $data++) { ?> <tr><td> <select name="test<?php echo $data?>"> <option value=1>1 <option value=2>2 <option value=3>3 <option value=4>4 <option value=5>5 <option value=6>6 <option value=7>7 <option value=8>8 <option value=9>9 <option value=10>10 </select> <?php } ?> ※option valueが20とか30とかになるとかなり見づらい処理かなと思います。 配列を変えるだけでいいようにしたいです。

    • 締切済み
    • PHP
  • セレクトメニューのリセットについて

    <select name="Q1_VALUE"> <option value="1" selected >AAAA</option> <option value="2" selected >BBBB</option> <option value="3" >CCCC</option> <option value="4" >DDDD</option> </select> <select name="Q2_VALUE"> <option value="1" selected >1111</option> <option value="2" >2222</option> <option value="3" >3333</option> </select> 上記セレクトメニューでQ1_VALUEの選択肢を変更した場合Q2_VALUEの選択肢をデフォルトに戻す方法を教えて下さい。

専門家に質問してみよう