id:toshistyle
ベストアンサーあり
コンピュータウェブ制作

checkboxのチェック状態をcookieを使って保存したいと考えています。

保存ボタンを押すと、その時点でのチェック状態が保存されるようにしたいのですが、
JavaScriptとPHP間での変数のやりとりがうまくいきません。


勉強して以下のようなコードを書いてみましたが動作してくれません。
どのようなコードを書けばいいのか教えて頂ければ助かります。
よろしくお願いしますm(_ _)m
（div id = time以外のチェックボックスもあります）

＊HTML
<div id ="time" >
<input name="time[]" type="checkbox" value="morning">朝
<input name="time[]" type="checkbox" value="noon">昼
<input name="time[]" type="checkbox" value="evening">夜

＊JavaScript
var req_prm = {};
var time_cb = $('div#time > input:checkbox:checked');
if (time_cb != undefined) {
req_prm.time = time_cb.map(function(){return $(this).val();})
}

＊PHP
if (isset($_POST['time'])) {
setcookie('time', serialize($_POST['time']));
} else {
setcookie('time', '', time() - 3600);
}

if (isset($_COOKIE['time'])) {
$time = unserialize($_COOKIE['time']);
} else {
$time = array();
}

回答の条件
  • 1人5回まで
  • 登録：
  • 終了：2011/10/19 13:18:42

ベストアンサー

id:tdoi No.3

回答回数174ベストアンサー獲得回数75

こんな感じのこと？


<?php
if (isset($_GET['record'])) {
  $times = $_GET['time'];
  setcookie('times', serialize($times), time() + 30 * 60);
  exit;
}

$time = array();
if (isset($_COOKIE['times'])) {
  $times = unserialize($_COOKIE['times']);
}
?>
<html>
  <head>
    <script type="text/javascript" src="./jquery.js"></script>
    <script language="JavaScript">
<!--
function recordTime()
{
  var checkList = new Array(document.getElementById('morning'),
			     document.getElementById('noon'),
			     document.getElementById('evening'));
  var times = new Array();
  for (i = 0; i < checkList.length; ++i) {
    if (checkList[i].checked) {
      times.push(checkList[i].value);
    }
  }
  $.get("./index.php", { "time[]": times, "record": 1 });
}
-->
    </script>
  </head>
  <body>
    <div id ="time">
      <input name="time[]" type="checkbox" value="morning" id="morning" onClick="recordTime()" <?php if (in_array('morning', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="morning">朝</label>
      <input name="time[]" type="checkbox" value="noon" id="noon" onClick="recordTime()" <?php if (in_array('noon', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="noon">昼</label>
      <input name="time[]" type="checkbox" value="evening" id="evening" onClick="recordTime()" <?php if (in_array('evening', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="evening" >夜</label>
    </div>

  </body>
</html>

追記：

ごめんなさい。保存ボタン押したときだったのですね。

もっとシンプルにこんな感じでしょうか？

<?php
$time = array();
if (isset($_GET['time'])) {
  $times = $_GET['time'];
  setcookie('times', serialize($times), time() + 30 * 60);
} else if (isset($_COOKIE['times'])) {
  $times = unserialize($_COOKIE['times']);
}
?>
<html>
  <head>
  </head>
  <body>
    <form action="./checkbox.php">
    <div id ="time">
      <input name="time[]" type="checkbox" value="morning" id="morning" <?php if (in_array('morning', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="morning">朝</label>
      <input name="time[]" type="checkbox" value="noon" id="noon" <?php if (in_array('noon', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="noon">昼</label>
      <input name="time[]" type="checkbox" value="evening" id="evening" <?php if (in_array('evening', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="evening" >夜</label>
    </div>
      <input type="submit" value="保存"/>
    </form>
  </body>
</html>

その他の回答（2件）

id:TransFreeBSD No.1

回答回数668ベストアンサー獲得回数268

Javascript:PHP間で変数のやりとりを行うコードが見当たりません。

書かれているのは

  • HTML(DOM) -> JavaScript
  • HTML(POST) -> PHP -> Cookie
  • Cookie -> PHP

で、Cookieの内容がHTMLに反映されていないし、JavaScriptがCookieを扱っていません。

ユーザ, HTML, Cookie, JavaScript, PHPそれぞれどうチェックボックスの値が伝達されるべきか整理してください。

前の質問ではJavaScript, PHPそれぞれの方法が示されています。JavaScriptが使いたいのであれば、PHPではなくJavaScriptでCookieを扱う事になります。

id:Lhankor_Mhy No.2

回答回数814ベストアンサー獲得回数232

挙げられていないコードは存在しないものとして回答します。

HTML

まず、「保存ボタン」がHTMLにないと思うのでそれを書くところから始めて下さい。

次にPOSTするためのform要素がないので、それを書いて下さい。

JavaScript

このコードだけでは何もしてませんので削除して下さい。

PHP

Cookieから受け取った値をフォームに反映するためのコードがありませんので、それを書いて下さい。



たぶん

JavaScriptのことは忘れた方が良さそうです。

id:tdoi No.3

回答回数174ベストアンサー獲得回数75ここでベストアンサー

こんな感じのこと？


<?php
if (isset($_GET['record'])) {
  $times = $_GET['time'];
  setcookie('times', serialize($times), time() + 30 * 60);
  exit;
}

$time = array();
if (isset($_COOKIE['times'])) {
  $times = unserialize($_COOKIE['times']);
}
?>
<html>
  <head>
    <script type="text/javascript" src="./jquery.js"></script>
    <script language="JavaScript">
<!--
function recordTime()
{
  var checkList = new Array(document.getElementById('morning'),
			     document.getElementById('noon'),
			     document.getElementById('evening'));
  var times = new Array();
  for (i = 0; i < checkList.length; ++i) {
    if (checkList[i].checked) {
      times.push(checkList[i].value);
    }
  }
  $.get("./index.php", { "time[]": times, "record": 1 });
}
-->
    </script>
  </head>
  <body>
    <div id ="time">
      <input name="time[]" type="checkbox" value="morning" id="morning" onClick="recordTime()" <?php if (in_array('morning', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="morning">朝</label>
      <input name="time[]" type="checkbox" value="noon" id="noon" onClick="recordTime()" <?php if (in_array('noon', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="noon">昼</label>
      <input name="time[]" type="checkbox" value="evening" id="evening" onClick="recordTime()" <?php if (in_array('evening', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="evening" >夜</label>
    </div>

  </body>
</html>

追記：

ごめんなさい。保存ボタン押したときだったのですね。

もっとシンプルにこんな感じでしょうか？

<?php
$time = array();
if (isset($_GET['time'])) {
  $times = $_GET['time'];
  setcookie('times', serialize($times), time() + 30 * 60);
} else if (isset($_COOKIE['times'])) {
  $times = unserialize($_COOKIE['times']);
}
?>
<html>
  <head>
  </head>
  <body>
    <form action="./checkbox.php">
    <div id ="time">
      <input name="time[]" type="checkbox" value="morning" id="morning" <?php if (in_array('morning', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="morning">朝</label>
      <input name="time[]" type="checkbox" value="noon" id="noon" <?php if (in_array('noon', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="noon">昼</label>
      <input name="time[]" type="checkbox" value="evening" id="evening" <?php if (in_array('evening', $times)) {?>checked="CHECKED"<?php } ?> >
      <label for="evening" >夜</label>
    </div>
      <input type="submit" value="保存"/>
    </form>
  </body>
</html>

コメント（0件)

コメントはまだありません

この質問への反応（ブックマークコメント）

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません
ユーザー登録をして使いはじめる!無料
すでに登録されている方はこちらからログイン
この質問に含まれるキーワード
知りたいことを検索してみよう
▲ページトップへ