• 締切済み

Smartyで多次元配列をスマートに出力するには?

lunarxの回答

  • lunarx
  • ベストアンサー率39% (16/41)
回答No.1

とりあえずループ処理foreachやsectionを使おう。

hanamaru_goo
質問者

お礼

お陰さまで解決いたしました。 ありがとうございます。 ■php側 $array = array( array('0101','お買い物の流れ'), array('0102','お支払いについて'), array('0103','配送について'), array('0104','返品・交換について'), array('0105','メールマガジンについて'), ); $smarty->assign('SUB_MENU_1', $array); ■テンプレート側 <dl class="side_column"> <dt class="block_title">ショッピング案内</dt> <dd class="block_contents"> <ul class="sub_menu"> {section name=row loop=$SUB_MENU_1} <li><a href="index.php?contents={$SUB_MENU_1[row].0}">{$SUB_MENU_1[row].1}</a></li> {/section} </ul> </dd> </dl> 一度にやろうとしていたのがよくなかったみたいです。

hanamaru_goo
質問者

補足

lunarxさん、ありがとうございます。 <dl class="side_column"> <dt class="block_title">{$SUB_MENU[0][1]}</dt> <dd class="block_contents"> <ul class="sub_menu"> {section name=num loop=$SUB_MENU} <li><a href="index.php?contents={$SUB_MENU[num] ***">{$SUB_MENU[num] ***}</a></li> {/section} </ul> </dd> </dl> 上記テンプレートで「***」に入れるものがわかりません。 ちょっと多次元化しすぎたようで・・・ もう少しヒントをいただけませんか?

関連するQ&A

  • Smartyで添え字が全て文字列の多次元配列

    Smartyで添え字が全て文字列の多次元配列 いつもお世話になっております。 Smartyで添え字が全て文字列の多次元配列を表示したいと考えています。 ■■元データ■■ $menu_list = array( '魚' => array( 'サバ' => 'サバカレー', 'タイ' => 'タイカレー' ), '肉' => array( '豚肉' => 'ポークカレー', '牛肉' => 'ビーフカレー' ), '野菜' => array( 'キャベツ' => 'キャベツカレー', 'きゅうり' => 'きゅうりカレー' ) ); ■■期待する出力■■ <ul> <li>魚 <li>サバ/サバカレー<li> <li>サバ/サバカレー<li> </li> </ul> <ul> <li>肉 <li>豚肉/ポークカレー<li> <li>牛肉/ビーフカレー<li> </li> </ul> <ul> <li>野菜 <li>キャベツ/キャベツカレー<li> <li>きゅうり/きゅうりカレー<li> </li> </ul> 散々悩んだ挙句、Smarty側では当初次のようにしたところ、とりあえずはうまくいっています。 {foreach from=$menu_list key="key" item="item" name="loopName"} {if $smarty.foreach.loopName.iteration <= 3} {if $smarty.foreach.loopName.iteration == 1} <ul> <li>魚 {elseif $smarty.foreach.loopName.iteration == 2} <ul> <li>肉 {elseif $smarty.foreach.loopName.iteration == 3} <ul> <li>野菜 {/if} {foreach from=$menu_list.$key key="key" item="val"} <li>{$key}/{$val}</li> {/foreach} {/if} </li> </ul> {/foreach} 元データの内容は頻繁に変わるため、Smartyのテンプレートに添え字を直で書くのは 避けたいのですが、どうしたら良いのでしょうか。 できるだけPHP側で加工して、テンプレートはループで回すだけにしたいと考えています。 すみませんが、お知恵を貸していただけないでしょうか。 ・・・カレー食べたい。

    • ベストアンサー
    • PHP
  • smartyのforeachの使い方

    仮に$strが以下のような配列を持っている場合smartyのtpl側で 出力させたいのですがうまくいきません。 Array ( [0] => Array ( [id] => 1 [name] => 名前 [sub_id] => Array ( [0] => 12 [1] => 13 ) [sub_name] => Array ( [0] => あああ [1] => いいい ) [sub_cnt] => Array ( [0] => 5 [1] => 5 ) ) [1] => Array ( [id] => 1 [name] => 名前 ) ) sub_***は配列が存在するものとしないものがあります。 そしてtpl側は {foreach item=items from=$str} <ul id="side{$items.id}"> {foreach item=item from=$items} <li><a href="index.php?id={$item.sub_id}">{$item.sub_name} ({$item.sub_cnt})</a></li> {/foreach} </ul> {/foreach} とforeachを重ねてみたのですがsub_***の値が表示されない 状態です。 複雑な配列なのですがこの場合どうすればうまく表示させれるの でしょうか?

    • ベストアンサー
    • PHP
  • アコーディオンパネルの作成

    <ul class="level1"> <li>menufirst <ul class="level2"> <li><a href="">menu 1-1</a></li> <li><a href="">menu 1-2</a></li> <li><a href="">menu 1-3</a></li> </ul> </li> <li>menusecond <ul class="level2"> <li><a href="">menu 1-1</a></li> <li><a href="">menu 1-2</a></li> <li><a href="">menu 1-3</a></li> </ul> </li> <li>menuthird <ul class="level2"> <li><a href="">menu 2-1</a></li> <li><a href="">menu 2-2</a></li> <li><a href="">menu 2-3</a></li> </ul> </li> </ul> このHTMLにアコーディオンパネルを追加したいのですが、 多くのサンプルがdlやddで作ったものばかりでこれをul liで作ろうとすると 上手く作動しません。 何か良いJQueryのコーディング例があればご教授お願いいたします。

  • Smartyに関しまして

    require_once("Smarty/Smarty.class.php"); $smarty = new Smarty(); $smarty->template_dir = "./templates"; $smarty->compile_dir = "./templates_c"; $smarty->assign("message", "こんばんは"); $a = array('hello','php','html'); $smarty->assign('a',$a); $smarty->display("index.tpl"); これでindex.tplで出力すると日本語部分が「?????」になってしまいます。 何か設定がいるんでしょうか??

    • ベストアンサー
    • PHP
  • アコーディオン(jquery)クリック後他閉じたい

    プログラム初心者のものです。 jQueryを利用したアコーディオンメニューを作成したのですが、現在、クリック後開き、他をクリック後もクリック済みの箇所が開いた状態になっています。 <改善> クリックしたメニューのみ表示させたいのですが お手数おかけいたします、ご教示いただけますでしょうか。 下記にソースを掲載してみます。 【javascript】 $(function () { // 親メニュー処理 $('span').click(function() { // メニュー表示/非表示 $(this).next('ul').slideToggle('fast'); }); // 子メニュー処理 $('li').click(function(e) { // メニュー表示/非表示 $(this).children('ul').slideToggle('fast'); e.stopPropagation(); }); }); 【HTML】 <div id="nav"> <span class="btn1"><a href="#">A</a></span> <ul> <li class="t1"><a href="#">A-1</a> <ul> <li class="sub_t1">○○○○</li> <li class="sub_text"><a href="#">あいうえお</a></li> <li class="sub_text"><a href="#">かきくけこ</a></li> <li class="sub_t1">○○○○</li> <li class="sub_text"><a href="#">あいうえお</a></li> <li class="sub_text"><a href="#">かきくけこ</a></li> </ul> </li> <li class="t1"><a href="#">A-2</a> <ul> <li class="sub_t1">○○○○</li> <li class="sub_text"><a href="#">あいうえお</a></li> <li class="sub_text"><a href="#">かきくけこ</a></li> <li class="sub_t1">○○○○</li> <li class="sub_text"><a href="#">あいうえお</a></li> <li class="sub_text"><a href="#">かきくけこ</a></li> </ul> </li> <li class="t1"><a href="#">A-3</a> <ul> <li class="sub_t1">○○○○</li> <li class="sub_text"><a href="#">あいうえお</a></li> <li class="sub_text"><a href="#">かきくけこ</a></li> <li class="sub_t1">○○○○</li> <li class="sub_text"><a href="#">あいうえお</a></li> <li class="sub_text"><a href="#">かきくけこ</a></li> </ul> </li> </ul> </div> ご教授の程よろしくお願い致します。

  • jQueryのslideToggleについて

    jQueryのslideToggleについて質問です。 クリックするとドロップダウンメニューが表示されるとこまではOKです。 「メニュー1」のサブメニューが開いている状態で「メニュー2」をクリックすると ・既に開いている「メニュー1」のサブメニューが閉じる ・クリックされた「メニュー2」のサブメニューが開く としたいのですがどうすればいいのでしょうか? ■html <nav id="global-nav"> <ul> <li><a href="#">ホーム</a></li> <li> <a class="sub" href="#">メニュー1</a> <ul> <li><a href="#">sub1</a></li> <li><a href="#">sub2</a></li> <li><a href="#">sub3</a></li> </ul> </li> <li> <a class="sub" href="#">メニュー2</a> <ul> <li><a href="#">sub1</a></li> <li><a href="#">sub2</a></li> <li><a href="#">sub3</a></li> </ul> </li> <li><a href="#">メニュー3</a></li> </ul> </nav> ■js $('a.sub').click(function(){ $('#global-nav li ul').hide();//←既に開いている場合は他を閉じる $(this).next('ul').slideToggle('slow'); return false; }); jsの2行目を入れることで他のサブメニューが開いている場合の問題はクリアできたのですが「メニュー1」をクリックするたびにサブメニューが開くだけで閉じることがありません^^;

  • CSSのプルダウンメニュー

    menu1とmenu2の挙動について疑問があります。 添付画像をご覧ください。 menu2からsub4-1を選択している状態です。 この時、menu2の背景色が赤に戻らないのは仕様でしょうか? それとも何か間違っているのでしょうか? 背景を画像にしても同じ結果になります。 -------------------------------------------- ul#menu li{ float:left; list-style-type:none; text-align:center; } ul#menu ul li{ clear:both; } ul#menu li a,.menu1,.menu2{ display:block; width:200px; height:50px; line-height:50px; text-decoration:none; background:#ff0000; } ul#menu li a:hover,.menu1:hover,.menu2:hover{ background:#ffcc00; } ul#menu ul{ display:none; } ul#menu li:hover > ul{ display:block; position:absolute; } ul#menu ul ul{ margin:-50px 0 0 200px; } --------------------- <ul id="menu"> <li class="menu1">menu1</a> <ul> <li><a href="#">sub1</a> <ul> <li><a href="#">sub1-1</a></li> <li><a href="#">sub1-2</a></li> </ul> </li> <li><a href="#">sub2</a></li> </ul> </li> <li class="menu2">menu2</a> <ul> <li><a href="#">sub3</a></li> <li><a href="#">sub4</a> <ul> <li><a href="#">sub4-1</a></li> <li><a href="#">sub4-2</a></li> </ul> </li> </ul> </li> </ul> ------------------ お分かりになる方よろしくお願いします。

    • 締切済み
    • CSS
  • jQuery多層式アコーディオンメニューについて。

    javascript勉強中です。 jQueryを使っての多層式アコーディオンメニューですが、現在hoverでメニューが開く仕様になっています。 これをclickすることで開くようにするにはどうしたらいいか、アドバイスいただければ幸いです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $('ul.main li').hover(function(){ $('>ul:not(:animated)',this).slideDown('fast') },function(){ $('>ul',this).slideUp('fast'); }); }); </script> <style> ul.sub, ul.sub ul.sub{display:none;} </style> </head> <body> <ul class="main clearfix"> <li><a href="#">メニュー1</a> <ul class="sub"> <li><a href="#">サブ1-1</a> <ul class="sub"> <li><a href="#">サブ1A-1</a></li> </ul> </li> <li><a href="#">サブ1-2</a></li> </ul> </li> <li><a href="#">メニュー2</a> <ul class="sub"> <li><a href="#">サブ1-1</a> <ul class="sub"> <li><a href="#">サブ1A-1</a></li> </ul> </li> <li><a href="#">サブ1-2</a></li> </ul> </li> </ul> </body> </html> 何卒宜しくお願い申し上げます。

  • mootoolsを使ったドロップダウンメニューを同じページ内に複数使用したい

    javascript初心者です・・。 下記のURLからmootools 一式をDLしてドロップダウンのメニューを 設置しました。 http://www.css-lecture.com/log/javascript/043.html ↑ 1つ目のメニューは問題なく設置できました。 今回私がやりたい事は、同じページ内の違う場所に ドロップダウンメニューをもうひとつ設置したいのですが・・ どこを修正すれば良いかわからず困っています。 今現在の状況としては、 ・上記サイトでDLしたmooltools一式を、コピーして  単純に2セット用意してみました。 ・htmlを見ると、classではなくIDで組まれていたので、  2セット目のjs、cssを1セット目とは違うID名に変更してみました。 と、これだけで動くような簡単なものでは無かったのですね・・。 納期も迫り、大変困っています。。 どなたか助言をいただけたらと大変助かります。。 現在制作中のプルダウンの部分のhtml載せておきます。 <div id="menu-container"> <ul id="drop_down_menu"> <li id="btn01"><a href="#"><img src="../common/img/gnavi01_off.jpg" alt="トップ" width="116" height="56" /></a></li> <li class="menu" id="btn02"><a href="#">カテゴリ1</a> <ul class="links"> <li><a href="#">コンテンツ01</a></li> <li><a href="#">コンテンツ02</a></li> <li><a href="#">コンテンツ03</a></li> </ul> </li> <li class="menu" id="btn03"><a href="#">カテゴリ2</a> <ul class="links"> <li><a href="#">コンテンツ04</a></li> <li><a href="#">コンテンツ05</a></li> <li><a href="#">コンテンツ06</a></li> </ul> </li> <li class="menu" id="btn04"><a href="#">カテゴリ3</a> <ul class="links"> <li><a href="#">コンテンツ07</a></li> </ul> </li> <li id="btn05"><a href="#">カテゴリ4</a></li> </ul> </div> ↑これが1つ目のプルダウンメニューの箇所で、 同じように2つ目のメニューもid名を変えて組みました。 mootoolsのjsは、 header内に外部jsとして1つ目、2つ目のプルダウンメニュー分のjsを 順番に読み込ませています。 (先に読み込ませた方のプルダウンメニューが決まって動作しません)

  • CSS  IEバグ リストの後の隙間を消したい

    よろしくお願いします。 以下のメニューで、"sub_menu02" の下に隙間が出てしまいます。 IEのバグのようなのですが、回避方法ご教授願います。 *実際は、の部分はJAVASCRIPTによるプルダウンになってます。 --------------------------------------------------------------- <style> * { margin : 0; padding : 0; } body { margin : 0; padding : 0; background: #fafafa; } #slidemenu_sample { overflow:hidden; } #menu_1 { padding: 0; margin: 0 0 0 0; background-color: #e7f6ff; } div#contentsArea div#sNaviArea{ width: 175px; float: left; } div#contentsArea div#sNaviArea dd{ width: 163px; background: #ffffff; } div#contentsArea div#sNaviArea dd ul{ width: 163px; list-style: none; } div#contentsArea div#sNaviArea dd ul li{ width: 163px; border-top: 1px solid #dddddd; margin: 0; padding: 0; display: block; } div#contentsArea div#sNaviArea dd ul li.choice{ background: #e7f6ff; } div#contentsArea div#sNaviArea dd ul li a{ display: block; padding: 5px 0 5px 17px; } div#contentsArea div#sNaviArea dd ul.sNaviSmall li.choice{ background: #e7f6ff; } div#contentsArea div#sNaviArea dd ul.sNaviSmall li{ width: 153px; margin: 0 0 0 10px; display: block; background: #ffffff; } </style> <body> <div> <div id="contentsArea"> <div> <div id="sNaviArea"> <dl> <dd> <ul> <li><a href="">menu01</a></li ><li class="choice"><a href="">menu02</a><ul class="sNaviSmall"><li><a href="">sub_menu01</a></li><li id="slidemenu_sample"><a href="" onmouseout="menu_1.hidePopup('menu_1')" onmouseover="menu_1.showPopup('menu_1')">sub_menu02</a><ul id="menu_1" style="display:none" onmouseout="menu_1.hidePopup('menu_1')" onmouseover="menu_1.showPopup('menu_1')"><li><a href="">aaaaa</a></li><li><a href="">bbbbb</a></li><li><a href="">cccccc</a></li></ul></li ><li><a href="">sub_menu03</a></li></ul> </ul> </dd> </dl> </div> </div> </div> </div>