SELECTの選択状態を、複数のVALUE要素の一部を使ってCookie保存したい

解決済

質問者：kesigomu7
質問日時：2008/12/03 20:07
回答数：2件

1つの選択に複数のvalue値を持つSELECTで、
選択状態をCookieに保存しているのですが、
保存した後に、諸般の事情でSELECTに設定してあるvalueの値を変更(修正)しなければならないことがあります。
しかしそうすると、Cookieを読み込んだとき保存データとSELECTが照合出来なくなり選択状態を再現できません。

そこで、valueで持たせている数値のうち1ヶ所を連番にして、
そこだけ照合して読み込みできないかと思い立ちました。

v[1] = o.b.value.split(',')[3];
などとして、value値の一つを抜き出して保存するところまでは出来たのですが、
それをCookieから読み込んでも、複数のvalueの値の1ヶ所を選んで照合する方法がわかりません。
そもそも可能なのかもわからないのですが・・何か良い方法はないでしょうか？。

サンプルをHTML化してアップローダに置いたもの
http://kissho.xii.jp/1/src/1jyou57011.html

<HTML>
<BODY>
<form id="myform">
<BR>
セレクト1　<SELECT name="a">
<OPTION value="0,00,000,a00" selected>0</OPTION>
<OPTION value="1,11,111,a01">1</OPTION>
<OPTION value="2,22,222,a02">2</OPTION>
<OPTION value="3,33,333,a03">3</OPTION>
<OPTION value="4,44,444,a04">4</OPTION>
<OPTION value="5,55,555,a05">5</OPTION>
</SELECT>　← valueをまとめて保存。Cookieから読み込み選択状態の再現も可能。<BR>
<BR>
セレクト2　<SELECT name="b">
<OPTION value="0,00,000,b00" selected>0</OPTION>
<OPTION value="1,11,111,b01">1</OPTION>
<OPTION value="2,22,222,b02">2</OPTION>
<OPTION value="3,33,333,b03">3</OPTION>
<OPTION value="4,44,444,b04">4</OPTION>
<OPTION value="5,55,555,b05">5</OPTION>
</SELECT>　← 「,」で分離してvalue[3]のみ保存。読み込みで選択状態の再現まではできず。<BR>
<BR>
保存番号　<SELECT size="3" name="selectsave">
<OPTION value="v1" selected>保存1</OPTION>
<OPTION value="v2" >保存2</OPTION>
<OPTION value="v3" >保存3</OPTION>
</SELECT><BR>
<BR>
<INPUT type="button" value="セーブ" name="save" onclick="set_cookie()">　
<INPUT type="button" value="ロード" name="lord" onclick="get_cookie()">　
<input type="reset" value="リセット">
</form>
Cookieデータ表示<br><input type="text" size="50" id="sample">

<script language="JavaScript">

function set_cookie(){
o=document.getElementById('myform');
var v =[];
v[0] = o.a.value;
v[1] = o.b.value.split(',')[3];　//「,」で分離して[3]のみ保存

saveCookie( o.selectsave.value, v.join('/'),30);
document.getElementById('sample').value=v.join('/');
}

function get_cookie(){
var o=document.getElementById('myform');
var GET=loadCookie(o.selectsave.value).split('/');
document.getElementById('sample').value=loadCookie(o.selectsave.value);//sapmle
setvalue(document.getElementById('myform').a, GET[0]);
setvalue(document.getElementById('myform').b, GET[1]);

}
function setvalue(o,v){
for(i=0;i<o.length;i++) if(o[i].value==v) o[i].selected=true;
}

function saveCookie( vn, v, dy ){
if(navigator.cookieEnabled)
document.cookie = vn+ '='+ v+ ';expires='+ new Date((new Date()).getTime()+dy*24*3600000).toGMTString();
}
function loadCookie(vn){
var rt='';
if( vn && document.cookie ) {
var v = document.cookie.split(';');
for(i in v){ v[i].match(/^\s*(.*)=(.*)$/); if( RegExp.$1 == vn) { rt = RegExp.$2; break; } }
} return rt;
}

</script>
</BODY>
</HTML>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： fujillin
回答日時：2008/12/04 17:27

#1です。

なかみをちゃんと見たわけじゃないけど、loadCookieでは正しく値をとれているのに、最後にセットする時に、aもbも同じにvalueと比較しているから照合できないだけでは？
bの方は分解して一部だけ保存しているので、そのまま照合しても同じ値が存在するはずがない。

とりあえず、質問の例で言えば、bの方は
setvalue2(document.getElementById('myform').b, GET[1]);
とでもしておいて
function setvalue2(o,v){
for(i=0;i<o.length;i++) if(o[i].value.split(',')[3]==v) o[i].selected=true;
}
としてやれば、値のセットはできます。

表示している文字(text）のほうを識別子に利用するとか（これも変わるのかなぁ？）、単純な識別子を用いてデータセットを特定する考え方にするのが良いかと思う。（データセットの中身は書き換えるということなので）
このような識別子がないとすると、どのデータセットがどのデータセットと同じなのか（内容が変わるので、比較しても違う）そもそもわからないことになってしまう。

また、数も変わるということなので、該当するデータセットが存在しないというケースも想定して処理を考えておく必要があると思われます。
（ご質問の状態と同じことが起こります＝データが見つからない）

- 0
- 件

通報する

この回答へのお礼

>　としてやれば、値のセットはできます。

すごい！！。

やっぱり駄目なのかなぁ、と諦めかけてたんですが、、(＾＾；；
教えて頂いたコードの記述で希望通りの動作をするようになりました！。

>　表示している文字(text）のほうを識別子に利用するとか（これも変わるのかなぁ？）、

変更の可能性があるのと、
保存数が巨大計算表×数パターンで300項目ぐらいになるので、(汗
textだとvalueよりサイズが大きくなってしまい
一部の懸案箇所のみに導入でもCookieの容量制限4KBに引っ掛かりそうなんです。

逆に、valueの一部だけを保存する方式にすれば
今でも心許ないCookieサイズの大幅削減にも繋がって一石二鳥です(^^)。

>　単純な識別子を用いてデータセットを特定する考え方にするのが良いかと思う。（データセットの中身は書き換えるということなので）

ということで、valueの一つを連番にして持たせようと思ったんですが・・不味いのかな？。(汗

今回教えて頂いた箇所はずっと修正したかったんですけど
あちこち探しても手本として使えそうなサンプルや解説が見つからず困ってました。

ネットのどこにもない方法を教えて頂いて大変助かりました。ありがとうございました！。m(＿)m

通報する

お礼日時：2008/12/04 21:12

No.1

回答者： fujillin
回答日時：2008/12/03 22:20

よく理解してないけど・・・

クッキーから読み込んだ値と、各optionの値を「,」でsplitした先頭（？）の値とを比較して、一致したらそのオプションということで良いのでは？

そもそも、こちら側で附番できる管理用番号という感じであるならば、オプションのインデックス番号を識別子として使用しておけば、照合作業も不要になると思うけど・・・

それとも、オプションの内容の順番が入れ替わるとか、オプションの数も変化してしまうということなのだろうか？
照合しても、存在しない場合もあるということ？

いまいち状況が把握できてないので、外していたら失礼。

この回答への補足

ご回答ありがとうございます！。

> クッキーから読み込んだ値と、各optionの値を「,」でsplitした先頭（？）の値とを比較して、一致したらそのオプションということで良いのでは？

こんなのかな？
パズルの様にsplit(',')[]の置き場所を色々試してみたんですけど上手くいかず・・。
http://kissho.xii.jp/1/src/1jyou57019.html

function set_cookie(){
o=document.getElementById('myform');
var v =[];
v[0] = o.a.value;
v[1] = o.b.value.split(',')[0];　//「,」で分離して[0]のみ保存

saveCookie( o.selectsave.value, v.join('/'),30);
document.getElementById('sample').value=v.join('/');
}

function get_cookie(){
var o=document.getElementById('myform');
var GET=loadCookie(o.selectsave.value).split('/');
document.getElementById('sample').value=loadCookie(o.selectsave.value);//sapmle
setvalue(document.getElementById('myform').a, GET[0]);
setvalue(document.getElementById('myform').b.value.split(',')[0], GET[1]);//←ここをどうにかすれば良いと思ってるんですけど・・

> そもそも、こちら側で附番できる管理用番号という感じであるならば、オプションのインデックス番号を識別子として使用しておけば、照合作業も不要になると思うけど・・・

ネット上のサンプル(この保存プログラムも過去ログを参考に・・)などを見ながら改造している様な状態でして、、(＾＾；；
やり方がわかりません。　orz

> 照合しても、存在しない場合もあるということ？

いえ、数値が少し修正されるだけで、
「100」が「95」になったり「110」になったりという程度です。
しかし、ちょっとでも数値を修正すると照合できないので、数値とは別に照合用の連番を持たせられないかと。

補足日時：2008/12/03 23:03

通報する

- 0
- 件

通報する

この回答へのお礼

> それとも、オプションの内容の順番が入れ替わるとか、オプションの数も変化してしまうということなのだろうか？

value要素の数と勘違いしてました、orz

そうなんです、セレクトの選択項目を時々追加してるので、OPTIONの数や順番は変化します。
だからOPTIONの一番上から[0]～[30]という風に自動で連番を振られると、これまた後で順番を入れ替えできなくなってしまって困るんです・・。

　　　　　　　　　　value要素の数は一定
　　　　　　　　　　　↓　↓　↓　↓
<OPTION value="1,11,111,b01">1</OPTION>
<OPTION value="2,22,222,b02">2</OPTION>
　　　　　　　　　　　～～～～　・・・・
<OPTION value="9,99,999,b09">9</OPTION>　←OPTION(選択項目)が増えたり順番(上下の配置)が変わったりはする

通報する

お礼日時：2008/12/04 00:46

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！