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

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

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

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

タブ

コンテンツの上下左右に参照用のメニューを設けることで、複数の要素やページの表示を可能にするユーザーインターフェイスパターンのこと。メニューをクリックすると、一つの要素が可視化され、他の要素は見えなくなる。

配列

配列は、各データの要素(値または変数)が連続的に並べられたデータ構造です。各配列は添え字(INDEX)で識別されています。

Q&A

解決済

1回答

2187閲覧

【PHP】タブをクリックしたとき、該当する配列を呼び出したい。

kotaosu

総合スコア15

PHP

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

タブ

コンテンツの上下左右に参照用のメニューを設けることで、複数の要素やページの表示を可能にするユーザーインターフェイスパターンのこと。メニューをクリックすると、一つの要素が可視化され、他の要素は見えなくなる。

配列

配列は、各データの要素(値または変数)が連続的に並べられたデータ構造です。各配列は添え字(INDEX)で識別されています。

0グッド

0クリップ

投稿2018/02/14 06:26

編集2018/02/14 07:42

php

1コード 2$array = { 3aaaaaaaaaaaaaaaa, 4bbbbbbbbbbbbbbbb, 5cccccccccccccccc, 6. 7. 8. 9} 10 11phpの変数である$resultをブラウザで出力したときの表示結果 12array(5) { 13 [0]=> 14 array(3) { 15 [0]=> 16 string(文字数)"2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa" 17 [1]=> 18 string(文字数)"2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa" 19 [2]=> 20 string(文字数)"2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa" 21 } 22 [1]=> 23 array(5) { 24 [0]=> 25 string(文字数)"2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 26 [1]=> 27 string(文字数)"2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 28 [2]=> 29 string(文字数)"2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 30 [3]=> 31 string(文字数)"2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 32 [4]=> 33 string(文字数)"2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 34 } 35 [6]=> 36 array(5) { 37 [0]=> 38 string(文字数)"2017/1/1 00:00:00 福岡 cccccccccccccccc" 39 [1]=> 40 string(文字数)"2017/1/1 00:00:00 福岡 cccccccccccccccc" 41 [2]=> 42 string(文字数)"2017/1/1 00:00:00 福岡 cccccccccccccccc" 43 [3]=> 44 string(文字数)"2017/1/1 00:00:00 福岡 cccccccccccccccc" 45 [4]=> 46 string(文字数)"2017/1/1 00:00:00 福岡 cccccccccccccccc" 47 } 48 . 49 . 50 . 51 }

前回、$arrayの配列をタブにする方法を教えてもらいました。
php配列からタブを作成したい
https://teratail.com/questions/113263

今度はリンクとしてタブをクリックしたときに、該当する配列を呼び出すようにしたいのです。

例えば、タブが
aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbb cccccccccccccccc ...
とあって、
aaaaaaaaaaaaaaaaをクリックしたときに

$result内の
{2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa,
2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa,
2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa}
を呼び出すようにしたいのですが、
どうしたらいいでしょうか。

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

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

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

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

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

m.ts10806

2018/02/14 06:29

リンク先のURLはhttp・・・で始まるようにしないとただしくリンクされません。不要な文字列(url)が入っています。
kotaosu

2018/02/14 06:36

ご指摘ありがとうございます。修正いたしました。
m.ts10806

2018/02/14 06:48

タブについては前質問のままでしょうか?自身で何かしら工夫されたこともあるかと思いますので、あわせて現在のソースコードとして付け加えていただければと思います。
kotaosu

2018/02/14 06:55

ご返答ありがとうございます。 タブ作成に関しては構造はそのまま使用しておりますので 変更点などはございません。 よろしくお願いします。m(__)m
m.ts10806

2018/02/14 07:01 編集

ということはhref=の内容も同じじゃないとダメってことですよね。となるとこのままでは「phpの配列の中身」を取り出すのは難しいと思いますよ。
m.ts10806

2018/02/14 07:03

同一ページへの#~~リンクではPHPが再度実行できないためです(ajaxとか使えばいいかもしれませんが)href=の内容を変えるかjavascriptと連携させてajaxから呼び出すか、という形になるかと思います。
yoorwm

2018/02/14 07:06

コードが添付されていますが、これエラー出ませんか?
m.ts10806

2018/02/14 07:07

「タブの切り替え」を想定しているのでしたら「クリックしたときに呼び出し」ではなく「タブと同時にコンテンツとしてhtmlに入れておき初期非表示(cssのdisplay:none;)とし、クリックしたときに表示(display:block;)する」とした方が自然かと思います。
kotaosu

2018/02/14 07:14

mts10806さん ご返答ありがとうございます。呼び出しという表現が正しくなかったかもしれません。タグをクリックしたとき、該当する配列に移動するようなイメージです。CSSは現在考慮しておりません。https://allabout.co.jp/gm/gc/23969/2/
kotaosu

2018/02/14 07:18

yoorwmさん ご返答ありがとうございます。もしかしたら$resultの書き方は咄嗟に書いたので正しくないかもしれません。配列の中に配列があるということが伝わればと思います。
m.ts10806

2018/02/14 07:28

となるとphpほとんど関係ないですね。リンク先にあるような形にhtml出力できればいいわけですよね。 yoorwmさんも指摘されてますし、phpの書き方としてエラーが出ないような状態にしてもらえると助かります。
kotaosu

2018/02/14 07:44

mts10806さん ご返答ありがとうございます。ブラウザでphpを読み込んだときの表示に修正しました。
m.ts10806

2018/02/14 07:47

配列のキーに「aaaaaaaaaaaaaaaa」とかが入ってないんですね・・・了解です。考えてみます。
guest

回答1

0

ベストアンサー

おそらくこんな感じと思います。
※サンプルデータが同じものが並んでいたりするので、これだけではいかない可能性もありますが。

php

1<?php 2$a = [ 3 "aaaaaaaaaaaaaaaa", 4 "bbbbbbbbbbbbbbbb", 5 "cccccccccccccccc" 6]; 7$result = [ 8 [ 9 "2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa" 10 , 11 "2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa" 12 , 13 "2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa" 14 ], 15 [ 16 "2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 17 , 18 "2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 19 , 20 21 "2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 22 , 23 24 "2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 25 , 26 27 "2017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb" 28 ], 29 [ 30 31 "2017/1/1 00:00:00 福岡 cccccccccccccccc", 32 33 "2017/1/1 00:00:00 福岡 cccccccccccccccc", 34 35 "2017/1/1 00:00:00 福岡 cccccccccccccccc", 36 37 "2017/1/1 00:00:00 福岡 cccccccccccccccc", 38 39 "2017/1/1 00:00:00 福岡 cccccccccccccccc" 40 41 ] 42]; 43 44if (count($a) > 0 && count($result) > 0) { 45 $tab = '<p id="tabcontrol">' . PHP_EOL; 46 $tab_contents = '<div id="tabbody">' . PHP_EOL; 47 $count = 1; 48 foreach ($a as $val) { 49 $tab .= '<a href="#tabpage' . $count . '">' . htmlspecialchars($val) . '</a>' . PHP_EOL; 50 $tab_contents .= '<div id="tabpage' . $count . '">' . PHP_EOL; 51 52 $check = false; 53 foreach ($result as $row) { 54 if (preg_grep("/{$val}/", $row)) { 55 $tab_contents .= implode("<br />", $row) . PHP_EOL; 56 } 57 } 58 $tab_contents .= '</div>' . PHP_EOL; 59 $count ++; 60 } 61 $tab .= '</p>' . PHP_EOL; 62 $tab_contents .= '</div>' . PHP_EOL; 63} 64echo $tab; 65echo $tab_contents; 66?>

出力結果HTML

html

1<p id="tabcontrol"> 2<a href="#tabpage1">aaaaaaaaaaaaaaaa</a> 3<a href="#tabpage2">bbbbbbbbbbbbbbbb</a> 4<a href="#tabpage3">cccccccccccccccc</a> 5</p> 6<div id="tabbody"> 7<div id="tabpage1"> 82017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa<br /> 92017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa<br /> 102017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaa 11</div> 12<div id="tabpage2"> 132017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb<br /> 142017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb<br /> 152017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb<br /> 162017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb<br /> 172017/1/1 00:00:00 大阪 bbbbbbbbbbbbbbbb 18</div> 19<div id="tabpage3"> 202017/1/1 00:00:00 福岡 cccccccccccccccc<br /> 212017/1/1 00:00:00 福岡 cccccccccccccccc<br /> 222017/1/1 00:00:00 福岡 cccccccccccccccc<br /> 232017/1/1 00:00:00 福岡 cccccccccccccccc<br /> 242017/1/1 00:00:00 福岡 cccccccccccccccc 25</div> 26</div> 27

$resultのキーにタブ名称やコードが入っていればpreg_grep()のように正規表現かけなくてももっと楽にできると思います。
(これだけだと抜け穴多いですし)
データ($result)の受け取り方で工夫できるならそちらの方が良いかもしれません。

投稿2018/02/14 08:09

m.ts10806

総合スコア80765

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

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

kotaosu

2018/02/14 08:30

無事解決することができました。 長い時間お付き合いいただきありがとうございました!!
m.ts10806

2018/02/15 00:05

javascript,cssの機能と上手く連動させるのは難しいですがphpでWebサイトを構築していく上では 必須の技術となります。 回答後半に書いたようにデータの持たせ方でより楽に画面表示ができるようになることも良くありますので その観点からもアプローチしてみてくださいね。
kotaosu

2018/02/15 05:12

ありがとうございます!いろいろ頑張ってみます。最後にお聞きしたいことがあるのですが、 2017/1/1 00:00:00 東京 aaaaaaaaaaaaaaaaをテーブルで 日付 時間 場所 文字 のように表にするのは難易度的に難しいですか?
m.ts10806

2018/02/15 05:15

難しくはないですが、1文字列に格納されているというのであれば色々と考慮しなければならないことがあります。 スペースで区切られているのであれば「文字の中にスペースがあった場合はどうするか」とか。 もしcsvやデータベースから取得というのであれば取得時点でそれぞれ区分けをした上で取得しておくとか既にコメントで書いたように「データの持たせ方」の方を工夫した方がソースコードが冗長にならなくて済みます。
kotaosu

2018/02/15 06:33

最初にファイルを読み込んだ際、データを2次元配列にして格納したほうが表を作成しやすそうですね。
m.ts10806

2018/02/15 06:35

そうそう、そういうことです。何番目に何が来るというのが分かっていればヘッダ込みで作りやすくなります。
kotaosu

2018/02/15 08:29

$resultを多次元配列にする方法いろいろ考えていたんですが結構難しそうですね。>< また質問させてもらいます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問