質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.44%
PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

2回答

12291閲覧

消去する時、「本当に消去しますか?」とアラートしたい。

hellommm

総合スコア49

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2018/04/17 15:39

編集2018/04/18 04:19

phpの勉強で簡昜掲示板を作っております。
<内容>
名前、コメント、パスワードを入力し追加ボタンを押すとテキストファイル(Kadai2_15.txt)に
番号<>名前<>コメント<>日時<>パスワード
といった形で保存される。
保存した内容をKadai2_1sam.phpに出力する。

消去機能を実行する場合は、消去したい番号とパスワードを入力し、消去。
編集機能を実行する場合は、編集したい番号とパスワードを入力し、編集。

<やりたい事>
消去ボタンおした時、本当に消去しますか?とアラートする機能を作りたいです。

<できない事>
下のコードではjavaScriptでアラートさせているのですが、キャンセルした時も
消去処理が完了してしまいます。

Kadai2_1sam.php

php

1<?php 2header('Content-Type: text/html; charset=UTF-8'); 3 4require_once('Kadai2_15sam.php'); 5?> 6<html> 7 <head> 8 <meta charset="utf-8"/> 9 <title>sample</title> 10 <script type="text/javascript"> 11 function disp(){ 12 13 // 「OK」時の処理開始 + 確認ダイアログの表示 14 if(window.confirm('本当にいいんですね?')){ 15 16 location.href = "Kadai2_15sam.php"; // Kadai2_15sam.php へジャンプ 17 18 } 19 // 「OK」時の処理終了 20 // 「キャンセル」時の処理開始 21 else{ 22 <?php 23 $_POST["delete"] = NULL; 24 ?> 25 window.alert('キャンセルされました'); // 警告ダイアログを表示 26 27 } 28 // 「キャンセル」時の処理終了 29 30 } 31 </script> 32 </head> 33 <body> 34 <form method="post" action="<?php echo($_SERVER['SCRIPT_NAME']) ?>"> 35 <input type="hidden" name="editmode" value="<?php echo($_POST['editNo']);?>"> 36 <p>名前:</p> 37 <input type="text" value="<?php echo($simEdit[1]); ?>" name="name" required="required"> 38 <p>コメント:</p> 39 <textarea type="text" name="com" maxlength="20" required><?php echo $simEdit[2]; ?></textarea> 40 <p>パスワード:</p> 41 <input type="password" name="pas" required="required" maxlength='8' placeholder='8字以内'> 42 <input type="submit" name="add" value="追加"> 43 </form> 44 <form action="<?php echo($_SERVER['SCRIPT_NAME']) ?>" method="POST"> 45 <p>削除対象番号:</p><!-- 削除対象番号 --> 46 <input type="number" name="deleteNo"> 47 <p>消去パスワード:</p> 48 <input type="password" name="delpas" required="required" maxlength='8' placeholder='8字以内'> 49 <input type="submit" name="delete" value="削除" onClick="disp()"> 50 </form> 51 <form action="<?php echo($_SERVER['SCRIPT_NAME']) ?>" method="POST"> 52 <p>編集対象番号:</p><!-- 編集対象番号 --> 53 <input type="number" name="editNo"> 54 <p>編集パスワード:</p> 55 <input type="password" name="editpas" required="required" maxlength='8' placeholder='8字以内'> 56 <input type="submit" name="edit" value="編集"> 57 </form> 58 <p> 59 <p> 60 掲示板: 61 </p> 62 <?php 63 64 foreach ((array)$text_rows as $text_row) {//配列でcount<>name<>comment<>data表示 65 if($text_row === ""){ 66 continue;//空の時、次の配列へ 67 } 68 $ret = explode("<>", $text_row); 69 echo h($ret[0])."番 "; 70 echo h($ret[1])." さん "; 71 echo h($ret[2])." "; 72 echo h($ret[3]); 73 echo "<br>"; 74 75 } 76 ?> 77 78 </p> 79 </body> 80</html> 81

Kadai2_15sam.php

php

1<?php 2header('Content-Type: text/html; charset=UTF-8'); 3?> 4<html> 5 <head> 6 <meta charset="utf-8"/> 7 <title>sample</title> 8 </head> 9 <body> 10 11 <?php 12 13 function h($str) { 14 return htmlspecialchars($str, ENT_QUOTES, 'UTF-8'); 15 } 16 17 //session_start(); // 1 18 19 $name = (string)filter_input(INPUT_POST, 'name'); //名前フォーム値 文字列にキャスト 20 $comment = (string)filter_input(INPUT_POST, 'com');//コメントフォーム値 フィルタリングする 21 $pas = (string)filter_input(INPUT_POST, 'pas');//password 22 $fileName = 'Kadai2_15.txt'; 23 24 //投稿追加処理 25 if (isset($_POST["add"]) && empty($_POST["editmode"])) 26 { 27 echo "追加モード!"; 28 $fp = fopen($fileName, 'a+'); 29 flock($fp, LOCK_SH); 30 $text_rows = file($fileName); 31 //var_dump($text_rows); 32 $lastline = explode("<>", $text_rows[count($text_rows)-1]);//<>で配列を作る。 33 $num = $lastline[0];//番号取得 34 $add_text = ($num + 1)."<>".$name."<>".trim($comment)."<>".date('H時i分')."<>".trim($pas);//追加したい文章 35 array_unshift($text_rows, $add_text);//一つ以上の要素を配列の最初に加える 36 flock($fp, LOCK_EX); 37 fwrite($fp, $add_text."\n"); 38 flock($fp, LOCK_UN); 39 fclose($fp); 40 } 41 42 //投稿削除処理 43 if (isset($_POST["delete"])) 44 { 45 echo "消去モード!"; 46 $fp = fopen($fileName, 'a+'); 47 $delete = $_POST["deleteNo"]; 48 $delpas = $_POST["delpas"]; 49 flock($fp, LOCK_SH); 50 $text_rows = file($fileName); 51 //var_dump($delarray); 52 for ($j = 0; $j < count($text_rows) ; $j++) 53 { 54 $delData = explode("<>", $text_rows[$j]);//配列に格納 55 var_dump($delData); 56 var_dump($delpas); 57 if ($delData[0] == $delete && trim($delData[4]) == $delpas)//番号が同じ時 58 { 59 array_splice($text_rows, $j, 1);//置換 60 file_put_contents($fileName, implode($text_rows)); 61 flock($fp, LOCK_UN); 62 fclose($fp); 63 } 64 } 65 } 66 67 //投稿編集処理 68 if (isset($_POST["edit"])) 69 { 70 echo "編集フォーム!"; 71 $fp = fopen($fileName, 'a+'); 72 $edit = $_POST["editNo"]; 73 $editpas = $_POST["editpas"]; 74 //print_r($edit); 75 flock($fp, LOCK_SH); 76 $text_rows = file($fileName); 77 //var_dump($editarray);// 78 for ($j = 0; $j < count($text_rows); $j++) 79 { 80 $ediData = explode("<>", $text_rows[$j]); 81 //var_dump($ediData); 82 //var_dump($editpas); 83 if ($ediData[0] == $edit && trim($ediData[4]) == $editpas) 84 { 85 for($h = 0; $h < count($ediData); $h++) 86 { 87 $simEdit[$h] = mb_substr(trim($ediData[$h]), 0); 88 89 } 90 //var_dump($simEdit); 91 flock($fp, LOCK_UN); 92 fclose($fp); 93 } 94 } 95 } 96 97 if (isset($_POST["add"]) && !empty($_POST['editmode'])) 98 { 99 echo "編集モード!"; 100 $fp = fopen($fileName, 'a+'); 101 $edit = $_POST["editNo"]; 102 flock($fp, LOCK_SH); 103 $text_rows = file($fileName); 104 //var_dump($text_rows);// 105 for ($j = 0; $j < count($text_rows); $j++) 106 { 107 $ediData2 = explode("<>", $text_rows[$j]); 108 if ($ediData2[0] == $_POST['editmode']) 109 { 110 $ediData2[1] = $name;//POST[’name’] 111 $ediData2[2] = $comment;//POST[’comment’] 112 $ediData2[4] = $pas;//POST[’pas’] 113 $text_rows[$j] = implode("<>", $ediData2); 114 //var_dump($text_rows); 115 file_put_contents($fileName,implode($text_rows)); 116 flock($fp, LOCK_UN); 117 fclose($fp); 118 } 119 } 120 //var_dump($ediData2); 121 } 122 123 124 125 126 ?> 127 </body> 128 129</html>

実装画面
イメージ説明

まだまだ未熟者ですがよろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

前提部分をおそらく理解されていないからだと思いますが、
ソースコード上のいくら下に書いたとしてもPHPがjavascriptより後に実行されることはありません。

なぜならPHPはサーバー側の言語でjavascript(html、cssも)はクライアント側の言語だからです。
PHPが処理を行い、画面出力を行うことでhtml表示となるわけです。
javascriptが一番後に実行されるものと思っておいて良いです。
つまり「確認アラートキャンセル時」の$_POST["delete"] = NULL;は意味がありません。

そもそも最初のPHP自体$_POSTされてない状態で開くので変数未定義のエラーが出ているはず。
NOTICEレベルだとは思いますが、エラーは全レベル表示するようにしておいてください。PHPのエラー表示設定について

他にもあると思うのでチェックしてみてください。

さて、そもそもですが作りがかなりおかしいことになっています。
Kadai2_1samの冒頭でKadai2_15samをrequireしているのでブラウザの「ソースを表示」すると<html>が二重になっていませんか?
「Kadai2_15samで処理を行う」という仕組みを作りたいのであれば、Kadai2_1sam冒頭にKadai2_15samを入れておく必要はありません。
つまり require_once('Kadai2_15sam.php'); は不要です。

Kadai2_15samでは$_POSTで情報を受け取っていますが、location.hrefで飛ばしているため、GETで遷移していることになります。
せっかくformでmethod=postで指定しているにも関わらずlocation.hrefしてしまっては意味がありません。

「キャンセル」を押しても送信されてしまうのはmethod=postでsubmitしているからです。明示的に止めない限り、submitは送信されます。

あとはKadai2_15samで削除したいならactionの指定先もKadai2_15samにしておくべきですね。$_SERVER['SCRIPT_NAME']だと自身のファイル名をさしています。

幾つか方法があるので挙げておきます。

1:return false;
falseを受け取るように明示するとキャンセルを受け取りsubmitを止める

php

1 <form action="Kadai2_15sam.php" method="POST"> 2 <p>削除対象番号:</p><!-- 削除対象番号 --> 3 <input type="number" name="deleteNo"> 4 <p>消去パスワード:</p> 5 <input type="password" name="delpas" required="required" maxlength='8' placeholder='8字以内'> 6 <input type="submit" name="delete" value="削除" onClick="disp();return false;"> 7 </form>

javascript

1 if(!window.confirm('本当にいいんですね?')){ 2 window.alert('キャンセルされました'); 3 return false; 4 } 5 6//submitは勝手にされるのでキャンセル時のみでOK

2:preventDefault 
submitのイベント自体を止めてOKのときだけ送信する場合

php

1 <form action="Kadai2_15sam.php" method="POST" name="deleteform"> 2 <p>削除対象番号:</p><!-- 削除対象番号 --> 3 <input type="number" name="deleteNo"> 4 <p>消去パスワード:</p> 5 <input type="password" name="delpas" required="required" maxlength='8' placeholder='8字以内'> 6 <input type="submit" name="delete" value="削除" onClick="disp(event);"> 7 </form>

javascript

1function disp(e){ 2 e.preventDefault(); 3 if(!window.confirm('本当にいいんですね?')){ 4 window.alert('キャンセルされました'); 5 return false; 6 } 7 8 document.deleteform.submit();

3:button
submit止めるくらいならボタンでいい という場合

php

1 <form action="Kadai2_15sam.php" method="POST" name="deleteform"> 2 <p>削除対象番号:</p><!-- 削除対象番号 --> 3 <input type="number" name="deleteNo"> 4 <p>消去パスワード:</p> 5 <input type="password" name="delpas" required="required" maxlength='8' placeholder='8字以内'> 6 <input type="button" name="delete" value="削除" onClick="disp();"> 7 </form>

javascript

1 if(!window.confirm('本当にいいんですね?')){ 2 window.alert('キャンセルされました'); 3 return false; 4 } 5 6 document.deleteform.submit();

ひとまず「submitはどういう動きをするか」を知っておけばあまり無駄な記述をせずに
必要な部分だけを処理として記述することができます。
あまりifのelseを増やしすぎるのも考え物ですので、記述の仕方次第で省略したまま簡潔に同じ処理を実現することができます(私は途中でreturnするのはかなり好きで多用しますが、elseをなるべく書きたくなくて、「そこで終わり」と明示したいためです。)

あと、実は 
window って「自身」をさすグローバル変数なので(ここの表現が難しいですが) 書かなくても良くて

js

1alert(); 2confirm();

だけでも動きます。※子ウィンドウなどを操作する場合は明示が必要。

蛇足:
かなり前から指摘されているかと思いますが簡”易”掲示板ですよね。

簡要・・・簡単で要点をよく押さえていること。また,そのような要点。
簡易・・・手順・手続が簡単で、たやすく(=易)行えること

「簡要」では意味が通じません。
字1つで全く意味が違ってくるのでそこは大切にしてください。

投稿2018/04/18 00:42

編集2018/04/18 01:45
m.ts10806

総合スコア80871

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2018/04/18 01:33

小ウィンドウ⇒子ウィンドウ(or別ウィンドウ)では。 回答とは関係ないですが、コードブロック言語指定の「javascript」は「js」って書けますよ。 ↓ 【このサイトのMarkdown記法のコードブロックで使える言語一覧(7119)|teratail】 https://teratail.com/questions/7119
m.ts10806

2018/04/18 01:45 編集

> 小ウィンドウ⇒子ウィンドウ(or別ウィンドウ)では。 ご指摘ありがとうございます。修正しました。 > 回答とは関係ないですが、コードブロック言語指定の「javascript」は「js」って書けますよ。 編集履歴見られたのだと思いますが、毎回javascriptって書いてました; お恥ずかしい・・・。 javascriptって書くのが無駄に早くなってしまうわけです・・・。 今後活用させていただきます。
hellommm

2018/04/18 04:28

本当に丁寧な回答ありがとうございます???????? やりたい事はできたのですが、mts10806さんのおっしゃってる。 「「Kadai2_15samで処理を行う」という仕組みを作りたいのであれば、Kadai2_1sam冒頭にKadai2_15samを入れておく必要はありません。 つまり require_once('Kadai2_15sam.php'); は不要です。」 とあるのですが、これを消してしまうとうまいこといかなくなります汗。 なので、Kadai2_15samの<html><head><body>の部分を消して二重にならないようにしたのですが、 それとこれとは話が違いますか?? あと 「あとはKadai2_15samで削除したいならactionの指定先もKadai2_15samにしておくべきですね。」 とあるのですが、Kadai2_15samに指定すると画面が真っ白になってうまいこといかなくなりました。。 何故、Kadai2_15samにする必要があるのでしょうか?? 未熟者で申し訳ありません。。 エラーの件ありがとうございます!実行してみます!!
m.ts10806

2018/04/18 04:41 編集

そもそもKadai2_15sam側に問題があるのでは。 「画面が真っ白」はPHPがエラー(割と高めのレベルのエラー)を吐き出してそこで処理が止まっているだけなので、やはりエラー出力はOnにしておくべきと思います。 勉強中、開発中であればなおさらです。特に最初の頃はエラーメッセージを解決することによって問題が解決するものだからです。 というか、プログラムの作りとしておかしいので、本来は全体的に作り直す必要があると思っています。 Kadai2_1samに対してpostするのであればKadai2_15samの存在の意味がありません。 途中でechoやらvar_dumpやらしているのでhtml構造としてもおかしくなるはずですし。 私としてはPHP処理部分とHTML部分が混ざっている時点でNGです。処理系と出力系は完全に分離した方がコードが見やすくなります。 例: //list.php <form action="delete.php" method="POST" name="deleteform"> <p>削除対象番号:</p><!-- 削除対象番号 --> <input type="number" name="deleteNo"> <p>消去パスワード:</p> <input type="password" name="delpas" required="required" maxlength='8' placeholder='8字以内'> <input type="button" name="delete" value="削除" onClick="disp();"> </form> //delete.php <?php $message = ""; if ($_SERVER ['REQUEST_METHOD'] === 'POST') { $no =filter_input(INPUT_POST, 'deleteNo'); $pass =filter_input(INPUT_POST, 'password'); //削除処理 $message = "削除成功"; }else{ die("不正アクセス"); } ?> <html> <body> 処理結果:<?=$message?> </body> </html> ----------------------- あと気になる点はPOSTされたデータを型キャストしているところですかね。 不正な入力情報が渡されることが心配であればバリデーション(入力内容のチェック)をして 不正であればエラーとして返すべきですね。まあこの辺りは次の段階でしょうけど。 安易なキャストはバグの温床となります。ご注意を。
guest

0

的外れでしたら、すみません。

js

1function disp(){ 2 if(window.confirm('本当にいいんですね?')){ 3 return true; 4 } else{ 5 //下のphpコード、おそらく必要ないように思えます。 6 <?php $_POST["delete"] = NULL; ?> 7 window.alert('キャンセルされました'); 8 return false; 9 } 10}

php

1<!-- formにonsubmitをつけます。↓ --> 2<form id="deleteForm" action="<?php echo($_SERVER['SCRIPT_NAME']) ?>" method="POST" onsubmit="return disp()"> 3 4 <p>削除対象番号:</p><!-- 削除対象番号 --> 5 <input type="number" name="deleteNo"> 6 <p>消去パスワード:</p> 7 <input type="password" name="delpas" required="required" maxlength='8' placeholder='8字以内' autocomplete="off"> 8 9 <!-- 元々あったonclickを削除。↓ --> 10 <input id="deleteSubmit" type="submit" name="delete" value="削除"> 11</form>

参考になるかもしれません。
https://stackoverflow.com/questions/4227043/how-do-i-cancel-form-submission-in-submit-button-onclick-event?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa

投稿2018/04/17 17:48

編集2018/04/17 18:15
fjaiofjawiefjaw

総合スコア210

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hellommm

2018/04/18 04:30

回答ありがとうございます! このやり方でもできました???? とても助かりました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.44%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問