• 締切済み

セレクトボックスの初期選択状態(SELECTED)を動的にしたいのですが

モーダル内に表示させるセレクトボックスで、毎回モーダル起動時ごとに、 セレクトボックス内の初期選択状態を変えたいと思っています。 1回目のモーダル起動時には本日の日付をSELECTEDにし、2回目以降は 前回のモーダル起動時に選択した値をSELECTEDにしたいと思っております。 いろいろな方法があると思うのですが(てっとりばやく、フラグを持たせる とか、クッキーを使うとか・・・)、正しく実行されず、困っています。 どなたか、よいアドバイスをください。お願いいたします。

みんなの回答

  • Ujiki
  • ベストアンサー率37% (38/101)
回答No.3

 『補足』『お礼』への発言がありませんので、一方通行ですので、大変心配しております。(^^)  どうやら、解決したのですね。SELECTEDをクッキーで制御したい点に付いては、回答していませんでしたので、追加しておきます。ここでは例として回答します。(^^);  SELECTでブラウザーの表示サイズを変更し、変更されたサイズをクッキー登録し、再度表示された場合にクッキー値があれば、SELECTEDを埋め込みます。(クッキー登録が無い場合、つまり最初の訪問とクッキー期限切れの時)は全画面表示します。クッキーの登録と呼び出しのfunctionは以下で答えています。 -------------------- <script language="JavaScript"><!-- function resize_x(that){ size_x = that.options[that.selectedIndex].value; redisp(size_x); SaveCookie('wd',size_x); } function redisp(size_x){ if( size_x < screen.availWidth && size_x > 0){ position_x = ( screen.availWidth - size_x ) / 2 ; self.resizeTo( size_x,screen.availHeight); self.moveTo(position_x,0); }else{ self.moveTo(0,0); self.resizeTo(screen.availWidth,screen.availHeight); } } wd = (LoadCookie('wd')!=null)? LoadCookie('wd'):'0' ; redisp(wd); // -->You need Java Script Runtime Processor ! </script> -------------------- 以上をHEAD内にでも登録します。 後はBODY中に -------------------- <table><form><tr><td> <select name=fix_size onChange="resize_x(this)"> <script language="JavaScript"><!-- document.write('<option value=640'); if(wd==640) document.write(' selected'); document.write('>640\n'); document.write('<option value=800'); if(wd==800) document.write(' selected'); document.write('>800\n'); document.write('<option value=1024'); if(wd==1024) document.write(' selected'); document.write('>1024\n'); document.write('<option value=0'); if(wd==0) document.write(' selected'); document.write('>full\n'); // --> </script> </select> </td></tr></form></table> -------------------- でご希望のSELECTEDは自動的に復元されます。ご健闘を祈ります。

  • Ujiki
  • ベストアンサー率37% (38/101)
回答No.2

 まず、動的に強制的にクッキーへの書き出しを行いましょう。クッキーへの登録と、読み出し用の JavaScript 関数を以下のようにします。(^^)  当方で利用中の書式です。(^^) <script language=javascript> <!-- function getFront(mainStr,searchStr) {foundOffset=mainStr.indexOf(searchStr); if (foundOffset==-1){ return null }; return mainStr.substring(0,foundOffset); }; function getEnd(mainStr,searchStr) {foundOffset=mainStr.indexOf(searchStr); if(foundOffset==-1){ return null }; return mainStr.substring(foundOffset+searchStr.length,mainStr.length); } function LoadCookie(name) {var str=getEnd(document.cookie,name+"="); if(str!=null){var tmp=getFront(str,";"); if(tmp!=null){ str=unescape(tmp) } else{ str=unescape(str) }; }; return str; } function SaveCookie(name,value) {var expires = new Date(); //このクッキーの賞味期限は1週間です。 expires.setTime(expires.getTime() + (7*24*60*60*1000)); document.cookie=name+"="+escape(value)+"; expires="+expires.toGMTString(); }; // --> Error ! (^^); </script> 以上が汎用のクッキーへの書き出しと、読み込みの関数です。ASCIIデーターであればエスケープ文字列へのエンコード・デコード処理は無用ですね。日本語を扱いたい場合は必要ですね。 SaveCookie(name,value) を任意に実行すればリアルタイムにクッキーへの書き込みを行います。この例では1週間保持されます。適当に有効時間を調整しましょう。 LoadCookie(name) で、text name に登録されたクッキーを受け取ります。 abc = (LoadCookie('Count')!=null)? LoadCookie('Count'):'1' ; などで呼び出します。クッキー名「 Count 」が登録されていなければ、文字データー「 1 」を変数「 abc 」に返します。  クッキー登録が理解できたら、SELECT 廻りをJavaScriptで飾り立てます。自力で出来ますか? (^^);

  • BlueRay
  • ベストアンサー率45% (204/453)
回答No.1

ようするに、モーダルウィンドウの初期起動状態の保持方法ですか? 簡単に作ってみたのですが、参考になるかどうかわかりませんが試してみてください。 以下のソースをファイルに貼り付けて実行してください。 注意:このサンプルは、モーダルを起動する画面が閉じられると、状態は初期の状態に戻ります。状態をずっと保持しておきたいなら、クッキーを使ったほうがいいと思います。 ☆サンプル file:a.htm ****************************************************************** <form name="test"> <input type="hidden" name="idx" value="1"> <input type="button" name="open" value="開く" onclick="window.open('b.htm', 'modal')"> </form> ****************************************************************** file:b.htm ****************************************************************** <script language="javascript"> <!-- function openInfo() { var no; no = opener.document.test.idx.value; document.test2.hiduke[no].checked = true; } function setInfo(iIdx) { opener.document.test.idx.value = iIdx; } //--> </script> <form name="test2"> <input type="radio" name="hiduke" onclick="setInfo('0')">前日<br> <input type="radio" name="hiduke" onclick="setInfo('1')">当日<br> <input type="radio" name="hiduke" onclick="setInfo('2')">明日<br> </form> <script language="javascript"> <!-- openInfo(); //--> </script> ******************************************************************

関連するQ&A