同じようなメニューが並ぶので、PHPでまとめて出力したいのですが…

Question

###実現したいこと

こんな感じのメニューがたくさん並ぶHTMLを考えています。

以下はとりあえず「fluits」だけ書きましたが、「drinks」とかそのようなものがいっぱい並ぶ感じです。（それぞれ構造は一緒ですが、<li>の数が異なります。）

これを、HTML静的にたくさん書くよりも、PHPでやってみたいと思いました。

<div data-main_menu="fluits">	
	<ul>	
		<li data-sub_menu="fluits_a">
			<p>fluits_aのp</p>
		</li>
		<li data-sub_menu="fluits_b">
			<p>fluits_bのp</p>
		</li>
	</ul>
</div>

<!-- 上の fluits と同様の構造で、 drinks などがたくさん並ぶ -->

###試したこと
あれやこれやと調べてみましたところ、一気に出力する関数を作り、その中で可変的な部分を配列にしておいて、それをforeachで回しながら順に連結して、最後に出力してあげればいいのかな？と思いました。

その結果として下のソースコードになったのですが、いかんせん、初心者すぎて歯が立たず、にっちもさっちもいかなくなってしまったため、書き方を教えて頂ければと思います。宜しくお願い致します。

<?php
// 一気に出力する関数
function echo_menus(){

    // <li>の数はfluitsは２つでdrinksは３つ、のように異なる
    $fluits_a = 'fluits_aのp';
    $fluits_b = 'fluits_bのp';
    $drinks_a = 'drinks_aのp';
    $drinks_b = 'drinks_bのp';
    $drinks_c = 'drinks_cのp';

    $sub_menus = array(
        'fluits' => array(
            'fluits_a' => $fluits_a,
            'fluits_b' => $fluits_b
        ),
        'drinks' => array(
            'drinks_a' => $drinks_a,
            'drinks_b' => $drinks_b,
            'drinks_c' => $drinks_c
        )
    );
    
    foreach( $sub_menus as $sub_menu ){
        
        $ret = '<div data-main_menu="'.$sub_menu.'">';
        $ret .= '    <ul>';
        
        foreach( $sub_menu as $key=>$k ){
            $ret .= '       <li data-sub_menu="'.$key.'">';
        	$ret .= '           <p>'.$k.'</p>';
        	$ret .= '       </li>';
        }   
        
        $ret .= '    </ul>';
        $ret .= '</div>';
    } 
    
    echo $ret;
}

echo_menus();

?>

Comments

[kei344]

（質問文は編集できます）「にっちもさっちもいかなくなってしまった」とは「何」が「どのように」わからないのか、「何をしたときに」「どうなると思って」「どうなったのか」を、出ているエラーなどと併せて、具体的に記述されたほうが回答を得られやすいと思います。

[moimoimoi]

なるほど気を付けます。ありがとうございます。

Answer 1

どこまでが共通部分なのか切り分けてください

<?PHP
$a=[
  [
    "menu"=>"fluits",
    "elems"=>[
      ["menu"=>"fluits_a","content"=>"fluits_aの内容"],
      ["menu"=>"fluits_b","content"=>"fluits_bの内容"],
      ]
    ],
  [
    "menu"=>"drinks",
    "elems"=>[
      ["menu"=>"drinks_a","content"=>"drinks_aの内容"],
      ["menu"=>"drinks_b","content"=>"drinks_bの内容"],
      ["menu"=>"drinks_c","content"=>"drinks_cの内容"],
      ],
    ],
  ];

foreach($a as $val){
print "<div data-main_menu=\"{$val["menu"]}\">\n";
print "<ul>\n";
foreach($val["elems"] as $sub){
print "<li data-sub_menu=\"{$sub["menu"]}\">\n";
print "<p>{$sub["content"]}</p>\n";
print "</li>\n";
}
print "</ul>\n";
print "</div>\n";
}

変数の展開

• ダブルクォート内のダブルクォートをエスケープ

print "<div class=\"momotarou\" data-main_menu=\"{$val["menu"]}\">\n";

• ダブルクォート内はシングルクォートでくくる

print "<div class='momotarou' data-main_menu='{$val["menu"]}'>\n";

• ヒアドキュメント

print <<<eof
<div class="momotarou" data-main_menu="{$val["menu"]}">

eof; 

Comments

[moimoimoi]

完璧にありがとうございます。出力時には「\n」を書けば改行されるんですね。今までPHPは改行できなくて不便だなぁと思ってました。笑

出力時は「print」の方がよかったですか？いまいち「echo」との区別がわかってなくて。

あと下記はなぜこのように書いているのでしょうか？正規表現？でしょうか？
print "<div data-main_menu=\"{$val["menu"]}\">\n";

自分の質問だと下記の書き方でしたが、これとの違いというか、意図したのはなんですか？
print "<div data-main_menu=" ' . $val["menu"] ' ">\n";

[yambejp]

> PHPは改行できなくて

ちゃんとやるならPHP_EOLという定数を行末にくっつけます
print "hogehoge".PHP_EOL;

> 「print」の方がよかったですか

Basicから入ったおっさんはprint好きです
厳密にはechoと挙動が違うのですが、気にする必要はありません
好きな方をつかってください

> なぜこのように書いている

PHPはダブルクォーテーション内の変数は自動的に展開されます
それが配列でも提示のような書き方をすれば展開されるので
手を抜く時にはよく書く方式です
ヒアドキュメントといってもっと複数行単位で処理する場合も
変数の展開が期待できます

[moimoimoi]

改行だけのだめに「PHP_EOL」というのも長いですね。わたしも「\n」を使うようにします。

printとの違いわかりにくくて、そういっていただけると安心します。

ダブルクオーテーションかどうかで大きな違いになりますねそれは。気を付けたいと思います。
実はクラス名をつけようと考えていたのですが、次のようにしたら仰る展開ができずあせりました。

print "<div data-main_menu=\"{$val["menu"]}\">\n";

↓展開できなくなった！

print '<div class="momotarou" data-main_menu=\"{$val["menu"]}\">\n';

このようにクラス名をつけるならば、教えて頂いたその書き方ではなくて、質問のような書き方になりますよね？（何度も申し訳ございません追加で。これで最後です。）

[yambejp]

> print '<div class="momotarou" data-main_menu=\"{$val["menu"]}\">\n';

外側をシングルクォートでくくると変数は展開されません
(かつ改行も判断されません)
※見づらいので回答分に追記しておきました

[moimoimoi]

あ、エスケープ、めちゃんこ便利！なるほど。こういうことだったんですね。いつも「こっちがシングルだから、えーっと、こっちをダブルにして…」とかやってました。エスケープすれば全部ダブルでいいんだ。なるほどー。
ご回答編集まで、どうもありがとうございます。お手数おかけしました。最後まで誠にありがとうございます。

Answer 2

        $ret = '<div data-main_menu="'.$sub_menu.'">';

で内容がリセットされているので、drinksの部分だけ出力されますね。
あと、上の状態だと、$sub_menuのところはArrayになっているのでは？

        foreach( $sub_menu as $key=>$k ){

と同じようなことをすれば、キーが出力されると思います。

Comments

[moimoimoi]

なるほどその段階ではまたArrayでしたか。ありがとうございます。