Is there a way to have a navigation entry with no link in zend navigation?

Question

I'm sure my question is pretty straight forward, and I've been looking for an answer to this, but I can't seem to make it work. I want to do something like this:

<?xml version="1.0" encoding="UTF-8"?>
<configdata>
<dashboard>
    <label>Dashboard</label>
    <controller>dashboard</controller>
    <action>index</action>
    <module>global</module>
</dashboard>
<bills>
    <label>Bills</label>
    <pages>
        <create-bill>
            <label>Create New Bill</label>
            <controller>bill</controller>
            <action>create</action>
            <module>global</module>
        </create-bill>
    </pages>
</bills>
</configdata>

Please note that in the <bills> section, I want to have a category with just a label, that way when I add styling later, I can hover over "Bills" and "Create New Bill" and other links will be shown, but clicking on "Bills" shouldn't do anything because it's just a category header.

I hope that makes sense.

Answer 1

You must specify a type for your page otherwise Zend_Navigation will throw an exception. In cases like yours I always use a Zend_Navigation_Page_Uri as page type and specify its uri to #. To apply this to your config file you could do this

<bills>
    <label>Bills</label>
    <uri>#</uri>
    <pages>
        <create-bill>
            <label>Create New Bill</label>
            <controller>bill</controller>
            <action>create</action>
            <module>global</module>
        </create-bill>
    </pages>
</bills>

The generated markup still contains a link but it will not point anywhere.

Moreover, since you need to bind some javascript to it in order to show the menu, you could even disable it by returning false in the click handler for that links.

In order to attach javascript callbacks (or some css) to that kind of link you may find useful to attach a class to those links. Within the same configuration file, you could with this code

<bills>
    <label>Bills</label>
    <uri>#</uri>
    <class>fakelink</class>
    <pages>
        <create-bill>
            <label>Create New Bill</label>
            <controller>bill</controller>
            <action>create</action>
            <module>global</module>
        </create-bill>
    </pages>
</bills>

In this case the generated markup would be

<li class="fakelink>
  <a href="#">Bills</a>
  <ul>submenu here</ul>
</li>

and you could easily select that kind of links with a javascript library. For example with jQuery you could do this:

$(function() { $('.fakelinks > a').click(function () { return false; }); });