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

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

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

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

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

3回答

5650閲覧

tableでthとtdの位置がずれる

kalon

総合スコア198

PHP

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

HTML

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2018/04/26 07:31

編集2018/04/26 07:39

いつもお世話になっております。

動作環境
jQuwey:jquery-3.3.1.min
Materialize: 1.0.0-beta
PHP7.2.4

以下のコードで書いたtbody,tr,tdをhtml側に埋め込みたいのですが

PHP

1function showSQL(){ 2 $dbh = accessSQL(); 3 $stmt = $dbh->query("SELECT id, code, prod_name, mount, category, end_date from hozon"); 4 foreach ($stmt as $value) { 5 echo "<table>"; 6 echo "<form name='show' method='post' action='index.php'>"; 7 echo "<input type='hidden' name='token' value='<?=CsrfValidator::generate()?>\'>"; 8 echo "<input type='hidden' name='code' value='".$value['id']."'>"; 9 echo "<tbody>"; 10 echo "<tr>"; 11 echo "<td align='center'>".$value['code']."</td>"; 12 echo "<td align='center'>".$value['prod_name']."</td>"; 13 echo "<td align='center'>".$value['mount']."</td>"; 14 echo "<td align='center'>".$value['category']."</td>"; 15 echo "<td align='center'>".$value['end_date']."</td>"; 16 echo "<td><input type='submit' name='del' value='削除' class='btn'></td>"; 17 echo "<tr>"; 18 echo "</tbody>"; 19 echo "</form>"; 20 } 21 22}

html

1 <table> 2 <thead> 3 <tr> 4 <th>商品コード</th> 5 <th>商品名</th> 6 <th>数量</th> 7 <th>種目</th> 8 <th>賞味期限</th> 9 <th>ボタン</th> 10 </tr> 11 <?php showSQL() ?> 12 </thead> 13 </table>

どうしても、以下のようにテーブルヘッダに沿って縦に綺麗に並びません。
イメージ説明
どうしたらテーブルヘッダとテーブルデータをきれいに縦並びにすることが出来るでしょうか?
アドバイスとご教授のほど、よろしくお願いします。

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

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

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

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

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

guest

回答3

0

ベストアンサー

・tbodyの中に、列でループして出力ようにする
・ループ中の「code」〜「end_date」は出力だけみたいなので、formは削除ボタンのセルの中に入れる
・theadとtbodyの列の数がおかしいので揃える
といったところでしょうか。

php

1function showSQL(){ 2 $dbh = accessSQL(); 3 $stmt = $dbh->query("SELECT id, code, prod_name, mount, category, end_date from hozon"); 4 foreach ($stmt as $value) { 5 echo "<tr>"; 6 echo "<td align='center'>".$value['code']."</td>"; 7 echo "<td align='center'>".$value['prod_name']."</td>"; 8 echo "<td align='center'>".$value['mount']."</td>"; 9 echo "<td align='center'>".$value['category']."</td>"; 10 echo "<td align='center'>".$value['end_date']."</td>"; 11 echo "<td>"; 12 echo "<form name='show' method='post' action='index.php'>"; 13 echo "<input type='hidden' name='token' value='<?=CsrfValidator::generate()?>\'>"; 14 echo "<input type='hidden' name='code' value='".$value['id']."'>"; 15 echo "<input type='submit' name='del' value='削除' class='btn'>" 16 echo "</form>"; 17 echo "</td>"; 18 echo "<tr>"; 19 } 20}

html

1 <table> 2 <thead> 3 <tr> 4 <th>商品コード</th> 5 <th>商品名</th> 6 <th>数量</th> 7 <th>種目</th> 8 <th>賞味期限</th> 9 <th>&nbsp;</th> 10 </tr> 11 </thead> 12 <tbody>; 13 <?php showSQL() ?> 14 </tbody> 15 </table>

投稿2018/04/26 07:53

編集2018/04/26 09:33
kszk311

総合スコア3404

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

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

kalon

2018/04/26 08:12

素早く的確、かつご丁寧にコードまで添削してくださり、ありがとうございます。
guest

0

デベロッパーツールで確認すると分かると思いますが、tableもループしているので
ループごとに毎回tableを作ってしまっています。
まず、tableを外にだすこと、そして閉じタグに注意して下さい。

php

1unction showSQL(){ 2 $dbh = accessSQL(); 3 $stmt = $dbh->query("SELECT id, code, prod_name, mount, category, end_date from hozon"); 4 echo "<form name='show' method='post' action='index.php'>";//formは外側に 5 echo "<tbody>";//tbodyもforeachの外に出す 6 foreach ($stmt as $value) { 7 echo "<input type='hidden' name='token' value='<?=CsrfValidator::generate()?>\'>"; 8 echo "<input type='hidden' name='code' value='".$value['id']."'>"; 9 echo "<tr>"; 10 echo "<td align='center'>".$value['code']."</td>"; 11 echo "<td align='center'>".$value['prod_name']."</td>"; 12 echo "<td align='center'>".$value['mount']."</td>"; 13 echo "<td align='center'>".$value['category']."</td>"; 14 echo "<td align='center'>".$value['end_date']."</td>"; 15 echo "<td><input type='submit' name='del' value='削除' class='btn'></td>"; 16 echo "<tr>"; 17 } 18 echo "</tbody>";//tbodyもforeachの外に出す 19 echo "</form>";//formは外側に 20 21}

追記

よく見たらtableの書き方も不思議なので修正が必要ですね。
thead内でループさせるのではなく、theadの後にして、
ループはtableを出力せずにtbodyの中身だけで良いでしょう。

html

1 <table> 2 <thead> 3 <tr> 4 <th>商品コード</th> 5 <th>商品名</th> 6 <th>数量</th> 7 <th>種目</th> 8 <th>賞味期限</th> 9 <th>ボタン</th> 10 </tr> 11 </thead> 12 <?php showSQL() ?> 13 </table>

投稿2018/04/26 07:41

編集2018/04/26 07:45
stampdoor

総合スコア483

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

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

namimon

2018/04/26 07:51

見た感じ、tdの中にformを入れた方がよさそうな気がします
kalon

2018/04/26 08:13

お返事ありがとうございます。その通りでした。
guest

0

thが5個でtdが6個となっています。
中が空でも良いので数を合わせられては?

投稿2018/04/26 07:35

m.ts10806

総合スコア80765

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

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

kalon

2018/04/26 07:41

ご指摘のほどありがとうございます。ボタンというテーブルヘッダを追加してみましたが、結果は変わりませんでした。上記質問のコードも更新いたしました。
m.ts10806

2018/04/26 07:43

ああ・・そうですね。 stampdoorさんの回答で気づきましたがtableを何個も作ってしまってますね。 数をあわせた上でshowSQL()の <table>を出力している部分を取り除けば良いですね。
m.ts10806

2018/04/26 07:47

最終的にブラウザには指定したhtmlなのでブラウザの「ソースを表示」できちんと想定通りの形になっているか確認しつつ調整すると良いです。 特にサーバー側の言語とCSSフレームワークなどを連携させる場合は必要な指定を盛り込みつつHTML出力しなければならないので、今回のようにずれることはよくあります。
kalon

2018/04/26 08:11

よくあることなんですね。ご指導のほどありがとうございます。
m.ts10806

2018/04/26 08:12

よくあることというか、CSSフレームワークって結構自動でhtmlを生成して動作しているので、 その部分は結局動かしてみないと分からない部分なんですよね。 使う側が動的にhtml生成しているときなんか特に(割と最近苦しんだのでお気持ち良く分かります)
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問