• ベストアンサー

チェックボックスのチェックを入れたものを再表示する

はじめまして。 phpを少しだけコピペプログラミングしたことがある者です。 今mixiアプリに挑戦しているのですが、 JavaScriptは全く知らないので困っています。 http://oshiete1.goo.ne.jp/qa4374471.html を見ましたがちょっと違うようです。 作りたいものはphpなら下記のようなものです。 http://www.pahoo.org/e-soul/webtech/php02/php02-20-01.shtm (プログラムを実行するをクリックしてみてください) 最終的にやりたいことは、マイミクの一覧を表示する際、 各マイミクの横にチェックボックスを設け、 チェックを入れたマイミクのみを再表示するというものですが、 とりあえずは、JavaScriptで チェックボックスのチェックを入れたものを再表示するやり方を教えてください。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.4

あ~ ・・・・。 エスパーにはなれそうにないね^^; test1.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="application/javascript"> <title>test1.html</title> <body> <form method="get" action="test2.html"> <p><input type="checkbox" name="items[0]" value="PHP">PHP <p><input type="checkbox" name="items[1]" value="Ruby">Ruby <p><input type="checkbox" name="items[2]" value="Perl">Perl <p><input type="checkbox" name="items[3]" value="Java">Java <p><input type="checkbox" name="items[4]" value="JavaScript">JavaScript <p><input type="checkbox" name="items[5]" value="VisualBasic">VisualBasic <p><input type="checkbox" name="items[6]" value="VisualC++">VisualC++ <p><input type="checkbox" name="items[7]" value="VisualC#">VisualC# <p><input type="submit" value="送信"> </form> </form> </body> </html> test2.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="application/javascript"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>test2.html</title> </head> <body> <div id="p">&nbsp;</div> <script type="text/javascript"><!-- function getLocation () {  var par = location.search.substring(1).split( '&' );  var cnt = 0, pac, nv, ret = { };  while( pac = par[ cnt++ ] ) {   nv = pac.split( '=' );   ret[ decodeURIComponent( nv[0] ) ] = decodeURIComponent( nv[1] );  }  return ret; } var key, txt = '', o, p = getLocation(); for( key in p )  txt += key + '=' + p[ key ] + '<br>'; document.getElementById( 'p' ).innerHTML = txt; //--> </script> </body> </html>

Scipio93
質問者

お礼

babu_babooさんありがとうございます。 items[0]=PHP items[4]=JavaScript の表示になりますが、動作を確認できました。 またmixiアプリ上でも同様に動きました! ありがとうございました。 最終的にやりたいことは、マイミクの一覧を表示する際、 各マイミクの横にチェックボックスを設け、 チェックを入れたマイミクのみを再表示するというものなので、 PHPの事例のように、質問項目が配列変数 $questions = array('PHP', 'Ruby', 'Perl', 'Java', 'JavaScript', 'VisualBasic', 'VisualC++', 'VisualC#'); のように並びませんでしょうか。 可能であれば何卒よろしくお願いいたします。

その他の回答 (5)

回答No.6

おやくにたてないようです。ごめんなさい。 あどれすのうしろのぶぶん http://ww/aa.aa.jp/index.hrml?「ここのぶぶん」← に、まえのぺーじのでーたをくっつけているので、 もじすうにせいげんがあり、すうひゃくのでーたは、むりっぽい とかんがえます。なので、PHPとかの、いたに、そうだんしたほうが よいのかも。

回答No.5

ごめんなさいね~。 わたし、にほんご、わからなくなりました。 りかいふのうです。だれか、かみくだいておしえて~! あなたが、あなたのなかで、りかいできていても それを、たにんが、りかいできるとはかぎらない。 しかも、そのあいてが、あかちゃんれべるなら、なおさらです そもそも、さいしょの、ごしつもんも・・・・

Scipio93
質問者

補足

全く自分勝手な意味不明の文章にもかかわらず ご返答いただき誠に申し訳ございません。 不況に苦しむ町工場の人間がmixiアプリにビジネス性を感じ、 やったこともないプログラミングに挑んでいる次第ですので、 何卒お許しください。 以前業務で使うとても簡単なWEBプログラムを、 PHPのサンプルコードからコピーして作った経験があり 今回もそのくらいのつもりでした。 しかし、opensocialの本はまだ一冊しかなく、 サンプルコードのサイトもほとんどなく、 JavaScriptもXMLもさっぱりわからないため困っております。 最終的にやりたいことは、マイミクの一覧を表示する際、 各マイミクの横にチェックボックスを設け、 チェックを入れたマイミクのみを再表示するというものです。 (そのあとそれを使い簡単なゲームのようなものをやります) したがって、今回は 'PHP', 'Ruby', 'Perl', 'Java', 'JavaScript', 'VisualBasic', 'VisualC++', 'VisualC#' の固定した8つにチェックボックスが入りましたが、実際は 'PHP', 'Ruby'のところがマイミクの名前に変わる点と、 人によりマイミクが数人の人もいれば、何十人、何百人(最大千人) の人もいる点とを、これからやらなければなりません。 マイミクの一覧を表示するプログラムの一例は下記のようなものです。 (これで動くという以外、内容は私にはさっぱりわかりません) gadgets.util.registerOnLoadHandler(init); function init() { loadFriends(); } function loadFriends() { var req = opensocial.newDataRequest(); req.add(req.newFetchPersonRequest(opensocial.IdSpec.PersonId.VIEWER), 'viewer'); var viewerFriends = opensocial.newIdSpec({ "userId" : "VIEWER", "groupId" : "FRIENDS" }); var opt_params = {}; opt_params[opensocial.DataRequest.PeopleRequestFields.MAX] = 100; req.add(req.newFetchPeopleRequest(viewerFriends, opt_params), 'viewerFriends'); req.send(onLoadFriends); } function onLoadFriends(data) { var viewer = data.get('viewer').getData(); var viewerFriends = data.get('viewerFriends').getData(); html = new Array(); html.push('<ol>'); viewerFriends.each(function(person) { if (person.getId()) { html.push('<li>' + person.getDisplayName() + "</li>"); } }); html.push('</ul>'); document.getElementById('friends').innerHTML = html.join(''); } function soshin(){ document.toroku.submit(); } <div id="friends"></div> 前半で得た最大100人のマイミク情報を 後半でArrayを使って表示しているようなので、 サンプルのPHPプログラムのように array('PHP', 'Ruby', 'Perl', 'Java', 'JavaScript', 'VisualBasic', 'VisualC++', 'VisualC#'); のように要素が並んでいれば、 応用ができるのではと考えた次第です。 しかしマイミクの名前を一人ひとり取り出し、 <p><input type="checkbox" name="items[0]" value="PHP">PHP <p><input type="checkbox" name="items[1]" value="Ruby">Ruby <p><input type="checkbox" name="items[2]" value="Perl">Perl の'PHP', 'Ruby', 'Perl'のところにコピーできればとも考えます。 すみません、もうすぐ昼休みが終わるためこれぐらいの説明になりますが、 もし可能であれば何卒よろしくお願いいたします。

  • ryu_chan
  • ベストアンサー率37% (69/186)
回答No.3

とりあえず、ご提示のPHPスクリプトと同じ動作のものを作ってみました。 <script> window.onload = function() { var values = []; var query = location.search.substr(1).split("&"); for ( var i in query ) { if ( query[i].match(/.+=(.+)/) ) { values.push( unescape(RegExp.$1) ); } } if ( values.length ) { document.getElementById("input").style.display = "none"; var result = document.getElementById("result"); var url = location.href.split("?")[0]; result.innerHTML = "<p>■選択された言語</b></p>" + values.join("<br>") + '<p><a href="' + url + '">戻る</a></p>'; } } </script> <form> <p id="input"> <input type="checkbox" name="item0" value="PHP">PHP<br> <input type="checkbox" name="item1" value="Ruby">Ruby<br> <input type="checkbox" name="item2" value="Perl">Perl<br> <input type="checkbox" name="item3" value="Java">Java<br> <input type="checkbox" name="item4" value="JavaScript">JavaScript<br> <input type="checkbox" name="item5" value="VisualBasic">VisualBasic<br> <input type="checkbox" name="item6" value="VisualC++">VisualC++<br> <input type="checkbox" name="item7" value="VisualC#">VisualC#<br> <input type="submit" value="送信"> </p> </form> <div id="result"> </div>

Scipio93
質問者

お礼

babu_babooさんありがとうございます。 動作も確認しました。 javascriptでも簡単に出来たのですね。 ただ、mixiアプリ上では動きませんでした。 選択して送信ボタンを押すと 400: Bad Request と出てしまいます。 完全にお手上げです。

回答No.2

//26歳、専業主婦の人妻です。^^; いろいろないみで、いみのないような、ながさになってしまいました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <title>test</title> <body> <form action="#"> <p> <input type="checkbox" name="abc"> <input type="checkbox" name="abc"> <input type="checkbox" name="abc"> <input type="checkbox" name="abc"> <input type="checkbox" name="abc"> <input type="checkbox" name="abc"> </p> </form> <script type="text/javascript"> var Collector = function ( tag, key, val ) {  var t = document.getElementsByTagName( tag );  var cnt = 0;  var buf = [];  var obj;    while( obj = t[ cnt++ ] )   if( obj[ key ] && obj[ key ] == val )    buf.push( obj );  return buf; }; var Manager = function ( ary, setFunc ) {  return function ( ) {   var cnt = 0;   var arg;   var parm;      while( parm = arguments[ cnt++ ] )    ary[ parm[0] ] && setFunc.call( ary[ parm[0] ], parm[1] );  }; }; var Setter = function ( sw ) {  this.checked = sw ? true: false; }; var checkbox = Manager( Collector( 'INPUT', 'type', 'checkbox' ), Setter ); //checkboxの 0,1,4番目をonにして、2,3番目をoffにする checkbox( [0, 1 ], [1,true], [4, 'on'], [2, false],[3,0] ); </script>

Scipio93
質問者

お礼

babu_babooさん、ありがとうございます。 JavaScriptでも可能だということがわかり希望が持てました。 ただ何分全くわかっていないもので、 ボタンを押したら画面が変わるところまでお教えいただけると助かります。 よろしくお願いいたします。

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

ご提示の質問の回答の中で引用されている質問がまさにそのままでは? サンプルも出てるみたいだし… http://oshiete1.goo.ne.jp/qa4359235.html

Scipio93
質問者

お礼

fujillinさん、ありがとうございます。 JavaScriptでも可能だということがわかり希望が持てました。 ただ何分全くわかっていないもので、 ボタンを押したら画面が変わるところまでお教えいただけると助かります。 よろしくお願いいたします。

関連するQ&A

  • チェックボックスについて

    こんばんは。いつもお世話になっておりますが、こちら(JavaScript)では、初めての投函です。 よくヤフーやホットメールなどのwebmailの受信ボックスなどに、削除するためのチェックボックスが備わっておりますが、全てのチェックを入れるために、最初の一行目のチェックボックスにチェックを入れることで全てにチェック。チェックを外す事で全てを外す。という動作が行われていると思います。 私、PHPの方ではよく質問させていただく事もあり、お恥ずかしいながら、上記質問をPHPで・・と思っていたら、これら動作はJavaScriptであることをお教え頂きました。 これまでJavaScriptには無縁であったこともあり、色々なサイトにお邪魔しているものの、設定ボタン、解除ボタンによる設定・解除の説明はあるものの、チェックボックスによる、これらの動作の説明がなく、改めてこちらにて質問させて頂くに至りました。 色々と試してはいるものの、チェックボックスにチェックを入れると全てにチェックが入るが、解除するまでに至っておりません。 お忙しい中恐縮ですが、ご指導のほど宜しくお願い申し上げます。

  • プルダウンメニューからチェックボックスを表示したい

    php、javascript、mysqlを使用し、プルダウンで選択後、チェックボックスを表示させる仕組みを作りたいのですが、 どうすればよいのか分かりません。 どなたか力を貸して頂きたく思います。 例えば下記のようなTBLがあったとします。 ■TBL:oya  oyaコード  10  20  30 ■TBL:ko  oyaコード    koコード  10        1100  10        1200  10        1300  20        2100  20        2200  30        3100 TBL 「oya」 をプルダウンメニューにセット。 プルダウンメニューを選択する度にTBL 「ko」を呼び出し、同ページ内にチェックボックスとして表示させたいと考えています。 例) ・10が選択されたら  「1100」、「1200」、「1300」のチェックボックスを表示する プルダウンメニューへのセットは出来たのですが、プルダウン選択後の「ko」を呼び出す箇所が分かりません。 php Mysql javascript で実現したいと考えております。 サンプルページでもいいですので、何かありましたら教えて下さい。 お分かりになる方よろしくお願いいたします。

  • チェックボックスを選択するとテキストボックスが表示

    質問失礼します。 チェックボックスが下記のようにある場合ですが、 どれかではなく複数選択で テキストボックスを表示させるにはどうしたらよいでしょうか? <input type="checkbox" name="example" value="" />テレビ ←チェックしたらテキストボックス表示 <input type="checkbox" name="example" value="" />新聞 ←チェックしたらテキストボックス表示 <input type="checkbox" name="example" value="" />CM ←チェックしたらテキストボックス表示 <input type="checkbox" name="example" value="" />その他 ←チェックしたらテキストボックス表示 色々なJavaScriptを試したのですが、 どうも挙動がおかしく、クリックを続けると表示がされたりできなかったり、 という具合になります。 それぞれテキストボックスを表示させたいチェックボックスに 反映できるJavaScriptをご教示願いますでしょうか? 宜しくお願い致します。

  • チェックボックスのチェック

    チェックボックスのチェックして送信した後のページから送信前のページに戻るとチェックボックスがチェックされた状態でブラウザで表示されます 1 2ここにチェックを入れて削除すると 3 1 3戻るを押した時にここにチェックが入ってしまいます javascriptで戻るボタンをつくっていますが他にチェックが残らずにに戻る方法はありますか? <input type=button value="戻る" onClick="history.back()"> よろしくお願いします

    • ベストアンサー
    • HTML
  • チェックボックスのチェックをつけたら

    まだJavaScriptかじりたてで,未熟ですみません。 出来るかどうかも分からないのですが, HPから小ウィンドウを開き、その小ウィンドウ内にチェックボックスと名前があります。 「チェックボックス」にチェックをつけた人の名前を、ボタンもなにも押さずに閉じるで、小ウィンドウを閉じたらもとのHPの指定した場所に名前を表示する事ってできるのでしょうか? ちなみに人は複数選択する可能性もあります. もしできたら、実践してみたいのですが、教えていただけないでしょうか?すみません。よろしくおねがいします。

  • チェックボックスデータを引き継ぐ

    index.htmlのチェックボックスのデータをa.phpで$jyusyoPOSTで受け取りデータベースからデータを取りだし表示させます。そしてb.phpにもチェックボックスの条件で表示させたいです。以前お聞きした際hiddenで出力し、取得しろとの事でしたが詳しく知りたいです。a.phpでどのように出力しb.phpでどのように取得するか詳しく教えて下さい。宜しくお願い致します。

    • ベストアンサー
    • PHP
  • ■PHPの初歩的なことについて・・・

    最近、PHPを使い始めたものです。 単語を半角スペースに区切って表示させるということを考えています。 例 今日は良い天気ですね    ↓ 今日は 良い 天気 ですね ここで、半角というのは見やすくさせるためで、別に全角スペースでもかまいません。 自分でいろいろ調べた結果、こういう素晴らしいサイトを見つけました。 http://www.pahoo.org/e-soul/webtech/php03/php03-01-01.shtm しかし、kakasiの使い方(置き方)がわからず、自サーバーではうまく動きません。 (上記サイトからPHPのサンプルをもらって、そのまま置いたのですが、うごきません。kakasiを置いてないので、動かないのは当然です;) また、実行結果の表示の仕方も頻度数で出てきてしまいます。 以下自分の環境 WindowsXP で 自宅サーバーを構築しています。 Apache PHP が実行可能です。 自宅サーバーで半角スペース空けで文章を表示させたいのですが、どうすればいいでしょうか?

    • ベストアンサー
    • PHP
  • チェックボックスのチェック済みを保持

    PHPを使ってフォームのチェックボックスの初期値にチェック済みでページを表示させ、そのチェックを外してサブミットし、同ページにリロードした際、セッションを使ってチェックを外した状態を保持しようとしているのですがうまくいきません。 チェックを外した状態でリロードしてもチェックがついた状態で表示されてしまいます、チェックを外した状態を保持表示させるにはどのように記述すればよいのでしょうか ご教授宜しくお願いします。 【PHP】 session_start(); $event = $_POST[ 'event' ]; $_SESSION[ 'event' ] = $event; if(!empty($event)){ $event_on = 'checked';} 【フォーム】 <form action="./" method="post" name="chbox"> <input type="checkbox" name="event" id="event" value="event" $event_on >イベント <button class="btn" onClick="boxCheck()" >表示</button> </form> 環境 php5.3 html5 javascriptのlocalStrage等を使ったほうが実装が現実的なら、検討いたします。

    • 締切済み
    • PHP
  • 画面が更新されてもチェックボックスのチェック状態を維持したい

    http://oshiete1.goo.ne.jp/kotaeru.php3?q=1972507 に追加質問です。 表示されている sample.php にあるチェックボックスをON/OFFしてから 再計算ボタンを押下後、チェックボックスのON/OFF状態を 引き継いで(維持して)sample.phpを表示させたいという質問ですが、 上記質問では、チェックボックスが配列扱いとなっており、 回答者の皆さんからはforeachによる解法をお教えいただきました。 今回は、下記のように配列でない場合の質問です。 <form action="<?php $PHP_SELF ?>" method="post"> <input type="checkbox" name="fruit" value="apple">りんご</td> <input type="submit" name="exec" value="再計算"> </form> よろしくお願い致します。

    • ベストアンサー
    • PHP
  • [メッセージボックスの表示]

    [メッセージボックスの表示] <?php $i=4; if($i>2){   ------メッセージボックス表示----- } elseif($i<0) { -----メッセージボックス表示---- } else { } ?> 上のようなPHPでメッセージボックスを表示させるにはどうすればよいでしょうか? 調べてみても、ボタンがクリックされると、メッセージボックスを表示するといった、javascriptを使用する方法ぐらいしかなくて、困っています。

    • ベストアンサー
    • PHP

専門家に質問してみよう