获取Zend_Navigation菜单以与jQuery的Fisheye一起使用 [英] Getting Zend_Navigation menu to work with jQuery's Fisheye

问题描述

我正在使用Zend_Navigation(该框架的甜蜜添加)来构建菜单，然后将其呈现在页面中(不言而喻).我首先将容器设置在控制器中的某个位置:

I'm using Zend_Navigation (sweet addition to the framework, btw) to build my menu, after which it should be rendered in the page (self-evidently). I first set the container somewhere in the controller:

// $pages is the array containing all page information
$nav = new Zend_Navigation($pages);
$this->view->navigation($nav);

然后，在布局中，其呈现方式如下:

Then, in the layout, it is rendered like this:

echo $this->navigation()->menu();

效果很好.现在:我希望菜单的呈现方式有所不同.我正在构建的页面使用jQuery Fisheye-plugin 建立Mac式的Dock选单.但是，此插件需要特定的标记...

which works perfectly. Now: I want the menu to be rendered a little differently. The page I'm building uses the jQuery Fisheye-plugin to build a Mac-like Dock-menu. However, this plugin needs a specific markup...

实际上，它包含一个<a>元素列表，其中包含一个<img>(用于图标)和一个<span>(用于工具提示).标准的菜单视图助手使用'label'参数作为链接文本，以逻辑方式呈现无序列表中的所有内容.

Actually, it takes a list of <a> elements containing both an <img> (for the icon) and a <span> (for the tooltip). The standard Menu view helper renders everything inside an unordered list (logically), with the 'label' parameter as the link text.

似乎传递给'label'参数的内容在渲染之前已转义，因此在其中插入html对我没有任何好处.另外，鱼眼镜头通常似乎并不将其项包含在<li>标记中，而整个内容都包裹在<ul></ul>中，而仅仅是一个<a>元素的单级列表.

It seems that content passed to the 'label' parameter is escaped before rendering, so inserting the html there won't do me any good. Additionally, the Fisheye usually doesn't seem to take its items contained in a <li> tag, with the entire thing wrapped in <ul></ul>, but just a one-level list of <a> elements.

我当时正在考虑为扩展坞编写一个自定义视图帮助程序，它可以帮助插入<img>和<span>，但是我很难连接到一个自定义视图帮助程序导航类.即使我的所有其他自定义类(模型等)都由自动加载器很好地照顾了，我也无法弄清楚它的放置位置和放置方式.有什么想法吗?

I was thinking about writing a custom view helper for the dock, which would be able to take care of inserting the <img> and the <span>, but I'm having a very hard time getting a custom view helper attached to the Navigation class. I just can't figure out where to place it and in what way, even though all my other custom classes (models and such) are sweetly taken care of by the autoloader. Any ideas on this?

再说一次，即使我可以使用该视图助手，但仍然留下了HTML无序列表-我知道使用自定义视图助手也可能会丢失该列表，但我一直都是粉丝为了语义的考虑，将主导航菜单包含在列表中.

Then again, even if I can get this view helper to work, I'm still left with the HTML unordered list - I know I can lose that one too using the custom view helper, but I've always been a fan of containing main navigation menus inside a list, for the sake of semantics.

如果有人可以帮助我一点，我将不胜感激.如果Fisheye不适合与<ul>一起使用，那就太糟糕了……在这种情况下，是否有充分的理由完全失去Zend_Navigation?

If anyone can help me out a little, I'd greatly appreciate it. If the Fisheye just isn't meant to work with <ul>'s, that'd be too bad... would there be a good reason for losing Zend_Navigation altogether in this case?

推荐答案

就制作自定义渲染器而言，我还没有看到这样的方法.这是我最终要做的事情:

I haven't seen the way yet either in terms of making a custom renderer. Here's what I ended up doing though:

首先，不要渲染默认的menu()调用，而是创建要渲染为的部分代码:

First, instead of rendering the default menu() call, create a partial to render into:

// menu.phtml is partial, cms is module
$partial = array('menu.phtml', 'cms');
$this->navigation()->menu()->setPartial($partial);
echo $this->navigation()->menu()->render();

然后(从文档中)，您可以像这样创建自定义"渲染:

Then (from the docs), you can create a "custom" render like so:

// -- inside menu.phtml
foreach ($this->container as $page) 
{
    // this just prints a "<a>" or "<span>" tag
    // depending on whether the page has a uri
    echo $this->menu()->htmlify($page), PHP_EOL;
}

我最终使用此脚本制作了最初的内容(一个带有一级子菜单的菜单):

I ended up making what I originally had (a menu with one level of submenus) with this script:

// -- another menu.phtml
<ul class="navigation">

<?php

$html = array();

foreach ($this->container as $page) 
{
    $html[] = "<li>";
    $html[] = $this->menu()->htmlify($page) . PHP_EOL;

    if (!empty($page->pages))
    {
        $html[] = "<ul>";
        foreach ($page->pages as $subpage) 
        {
            $html[] = "<li>";
            if ($href = $subpage->getHref()) $html[] = "<a href=\"{$href}\">";
            else $html[] = "<span>";
            $html[] = "<img src=\"/ui/cms/img/icons/edit.png\" alt=\"\"/>";
            $html[] = $subpage->getLabel();
            if ($href) $html[] = "</a>";
            else $html[] = "</span>";            
            $html[] = "</li>";
        }
        $html[] = "</ul>";
    }

    $html[] = "</li>";
}

echo join(PHP_EOL, $html);

?>
</ul>

您可以只更改部分中的标记，然后在其中添加图像/图标.

You could just change the markup in the partial and add your images/icons there.

这篇关于获取Zend_Navigation菜单以与jQuery的Fisheye一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！