IE11でJavascriptのonClickを使うとPOSTされない。

前提・実現したいこと

複数データがテーブルに出力されている画面（contact.php）で、削除したいデータのチェックボックスをチェックし、「削除ボタン」を押すと、削除しても良いかという削除確認画面（contact_delete.php）に遷移し、チェックしたデータのみ出力され、「はいボタン（削除ボタン）」クリックでデータが削除される、というシステムを作っています。

発生している問題は、IE11で確認すると、削除確認画面に出力されるはずの、データが何も出力されません。他のブラウザーで同じ問題が起こっていれば、コーディングミスだと思いますが、Firefox、Chrome、Operaで確認すると全く問題なく出力されます。

「試したこと」でも書いたように、isset($_POST['con_del_confirm'])にはfalseがセットされている為、IE11のみPOSTされていないのだと思います。

PHP、Javascript初心者です。詳しく、ご教授いただければありがたいです。よろしくお願いします。

★追加質問★
IEでは、InputタグやButtonタグのvalueやnameを送信されないということで、色々調べると、Buttonタグに「onClick="this.name='　　'"」と記述すると、IEでも他のブラウザーでもnameが送信されることがわかりました。ただ、この方法をされている方があまりいらっしゃらなくて、少し不安です。この記述をした場合、何か問題が発生するのでしょうか？

該当のソースコード

PHP
1削除画面（contact.php）
2
3<head>
4<script type="text/javascript">
5// 削除ボタン
6function Deletebutton(u){	
7	var check_name = 'id[]';
8	var ElementsCount = document.logincontactform.elements[check_name].length;
9	var flag = false;  
10
11		// only one checkbox left
12		if(ElementsCount == undefined){
13			if(document.logincontactform.elements[check_name].checked){
14				flag = true;
15		        var f = document.querySelector("form");
16	            var a = f.setAttribute("action", u);
17		        document.querySelector("form").submit();		   
18	         } 
19		 }
20         // more than one checkbox
21		 for(i=0; i<ElementsCount; i++){	
22		     if(document.logincontactform.elements[check_name][i].checked){
23		        flag = true;
24		        var f = document.querySelector("form");
25	            var a = f.setAttribute("action", u);
26		        document.querySelector("form").submit();		   
27	          }
28           }  
29          // when no checking a checkbox
30	      if (!flag){
31	          alert("Please check a checkbox.");
32          }
33}
34</script>
35</head>
36
37<body>
38<form action="contact.php" name="logincontactform" method="post">
39<table>
40<thead>
41<tr>
42<th><input type="button" value="Check all" onClick="Allcheck(true);"><input type="button" value="Uncheck all" onClick="Allcheck(false);"></th>
43<th>AAAA</th>
44<th>BBBB</th>
45<th>CCCC</th>
46</tr>
47</thead>
48
49<?php
50while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
51?>
52<tbody>
53<tr>
54<td><input type ="checkbox" value="<?php echo $row['Id']; ?>" name="id[]"></td>
55<td><?php echo htmlspecialchars($row['AAAA'], ENT_QUOTES); ?></td>
56<td><?php echo htmlspecialchars($row['BBBB'], ENT_QUOTES); ?></td>
57<td><?php echo htmlspecialchars($row['CCCC'], ENT_QUOTES); ?></td>
58</tr>
59<?php
60}
61$stmt = null;
62$dbh = null;
63?>
64</tbody>
65</table>
66//削除確認画面へ遷移するボタン
67<input type="submit" name="con_del_confirm" value="削除" onClick="Deletebutton('contact_delete.php')">
68</form>
69</body>

PHP
1削除確認画面（contact_delete.php）
2
3<body>
4<form action="contact_delete.php" name="logincontactform" method="post">
5<table>
6<thead>
7<tr>
8<th>AAAA</th>
9<th>BBBB</th>
10<th>CCCC</th>
11</tr>
12</thead>
13<tbody>
14<?php
15if (isset($_POST['con_del_confirm'])){
16   try{
17	   $dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
18   	$dbh->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
19	      foreach ($_SESSION['id'] as $id){
20		     $sql = "SELECT * FROM tbl_contact WHERE Id = '$id' ORDER BY Id";
21	         $stmt = $dbh->prepare($sql);
22		     $stmt->execute();
23
24while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
25?>
26
27<tr>
28<td><?php echo htmlspecialchars($row['AAAA'], ENT_QUOTES); ?></td>
29<td><?php echo htmlspecialchars($row['BBBB'], ENT_QUOTES); ?></td>
30<td><?php echo htmlspecialchars($row['CCCC'], ENT_QUOTES); ?></td>
31</tr>
32
33<?php
34}}
35unset($id);
36}catch(PDOException $Exception){
37	$dbh->rollBack();
38	echo "Database error : ".$Exception->getMessage();
39	exit;
40}
41$stmt = null;
42$dbh = null;
43}
44?>
45</tbody>
46</table>
47
48<input type="button" onclick="location.href='contact.php'" value="いいえ、前の画面に戻る">
49//削除ボタン
50<input type="submit" name="con_delete" value="はい">
51</form>
52</body>

試したこと

JavascriptのDeletebutton()を使用せずに、form内のactionに直接contact_delete.phpと書いてみると、IE11でも削除確認画面に問題なくデータが出力されました。ただ、この画面には他にもボタンが存在し、form内のactionには別の遷移先が書かれている為、contact_delete.phpと直接書くことはできません。

var_dumpでisset($_POST['con_del_confirm'])を確認すると、IE11では「false」が、その他のブラウザーでは「true」がセットされています。

補足情報（FW/ツールのバージョンなど）

Windows7を使用しています。

m.ts10806

2020/06/28 09:21

インデントぐちゃぐちゃなので、揃えられたほうが良いかと思います

maruchu

2020/06/30 19:48

揃えました。ご指摘ありがとうございます。

m.ts10806

2020/06/30 21:04

二つ目滅茶苦茶ですよ。手動でやるよりフォーマット機能のあるエディタ使った方が良いです

Orlofsky

2020/07/05 10:13

>IEは悲惨過ぎるバグが多いので、当サイトはIEはサポートしません、と明示して終るのがいちばん不幸にならないで済む解決方法です。

maruchu

2020/07/23 04:34

やはり、IEはバグが多いのですね。ご教示ありがとうございます。

行動規範の内容に同意します

回答2件

IEでは、buttonやsubmitでは、valueが送信されず、タグ内の文字列が送信されるようです。

Buttonタグでsubmitすると

ご提示いただいたコードでは、削除ボタンの終了タグがないため、値が送信されていないものと思われます。

IEにも対応したい場合、buttonでの送信は利用されないことをお勧めします。

投稿2020/06/28 15:18

YT0014

総合スコア1708

maruchu

2020/07/23 04:45

ご回答ありがとうございます。IEではbutton等のvalueは送信されないのですね。他の方法で試してみます。ありがとうございました！

行動規範の内容に同意します

ベストアンサー

追加質問について回答いたします。
this.name による自身の名前の書き換えは確かに可能です。
ですが、自分自身の名前を別名に書き換えることが可能になるため、後から見た際などに実際に使用されている name の判別がつきづらくなります。（一般的に可読性が下がると言われている現象です）
そのため、 name の上書きは行わないほうが良いです。

また、javascript特有の話として、this が指すオブジェクトが頻繁に変わるため this にはあまりアクセスしたがる人がいないというのも要因になるかと思います。

投稿2020/07/07 16:01