Wayfinder skipping items or not reading tree correctly

4 Posts

xgarbmodx Reply #1, 15 years, 1 month ago

Hi,

Got a problem with Wayfinder not generating the menu code for a pull down menu correctly when pages are moved around. When a pulldown fails to appear, sometimes it's fixed by dragging all the pages into another section and then back again.

Here's an example page: http://xoosphere.co.uk/ with two Wayfinder calls showing the problem on the second call.

At the top is a standard Wayfinder call of:

[[Wayfinder? &startId=`0`]]

Below that is a Wayfinder call of:

[[!Wayfinder?  &startId=`0` &parentRowTpl=`menuParent` &outerTpl=`menuOuter` &rowTpl=`menuRow` &innerTpl=`menuInner` &innerRowTpl=`menuInnerRow`]]

The code is as below for the parameters:
menuParent:

<ul class="nav"><li  class="sub-li"><a  class="sub-a" href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]><span>[[+wf.linktext]]</span></a><ul>[[+wf.wrapper]]</ul></li></ul>

menuOuter:

<div>[[+wf.wrapper]]</div>

menuRow:

<ul class="nav"><li><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]><span>[[+wf.linktext]]</span></a></li></ul>

menuInner:

[[+wf.wrapper]]

menuInnerRow:

<li><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]><span>[[+wf.linktext]]</span></a></li>

I had this problem before with another menu but assumed it was my menu code but now I'm wondering now if Wayfinder has a little bug that leads it to skip menu items or not read the tree correctly when certain parameters are set in the Wayfinder call.

Thanks,
xgarb

Revolution 2.1.3-pl : Wayfinder 2.3.1
[ed. note: xgarbmodx last edited this post 15 years, 1 month ago.]

793 Posts

ottogal Reply #2, 15 years ago

Hi xgarb,

I remembered a remark by myself in a former thread
(http://ttyl.modx.com/thread/?thread=64125.0%3Bal&i=1&page=2):

I just made this observation: If you delete the children of a resource, in Page Settings the Container checkbox remains ticked, and - obviously because of that - the &parentClass remains assigned to that resource.
So &parentClass does not depend on the existence of children but on the property of being a container.

I think what is said here about &parentClass also applies to the use of the &parentRowTpl.
So you should check if the resource top3 has the property Container checked or not.

This aside, the code output by your second Wayfinder call shows some strangeness:
Every li element is wrapped in a unnecessary pair of <ul>....</ul> tags.
The <div>....</div> inside of the

<div class="container">
.....
</div>

is superfluous. The whole menu should be wrapped by <ul>....</ul> instead.

So you better change the templates to the following:

menuParent:

<li  class="sub-li"><a  class="sub-a" href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]><span>[[+wf.linktext]]</span></a><ul>[[+wf.wrapper]]</ul></li>

menuOuter:

<ul>[[+wf.wrapper]]</ul>

menuRow:

<li><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]><span>[[+wf.linktext]]</span></a></li>

Hope that helps...
[ed. note: ottogal last edited this post 15 years ago.]

4 Posts

xgarbmodx Reply #3, 15 years ago

Ah, thanks!

in Page Settings the Container checkbox wasn't ticked.. not sure I would have ever worked that out.

Regarding the superfluous ul tags I was going from this menu: http://www.cssplay.co.uk/menus/snowstorm.html which does use that syntax. Maybe I should look for another menu.

793 Posts

ottogal Reply #4, 15 years ago

Regarding the superfluous ul tags I was going from this menu: http://www.cssplay.co.uk/menus/snowstorm.html which does use that syntax.

I don't think so. If you view the source code of this page, you see the ul tags only wrapped around complete submenus, not single rows.

4 Posts

xgarbmodx Reply #5, 15 years ago

Looks the same to me
His code

<div class="container">
<ul class="nav">
  <li><a href="#url">Home</a></li>
</ul>
<ul class="nav">
  <li class="sub-li"><a class="sub-a" href="#url">Contact Us</a>
    <ul>
      <li><a href="#url">Email</a></li>
      <li><a href="#url">Telephone</a></li>
      <li><a href="#url">Online Form</a></li>
      <li><a href="#url">Snail Mail Address</a></li>
    </ul>
  </li>
</ul>
<--snip-->

My code

<div class="container">
<ul class="nav">
  <li><a href="http://xoosphere.co.uk/" >Home</a></li>
</ul>
<ul class="nav">
  <li  class="sub-li"><a  class="sub-a" href="index.php?id=3" >Contact Us</a>
    <ul>
      <li><a href="index.php?id=2" >Email</a></li>
      <li><a href="index.php?id=5" >Telephone</a></li>
      <li><a href="index.php?id=6" >Online Form</a></li>
      <li><a href="index.php?id=8" >Snail Mail Address</a></li>
    </ul>
  </li>
</ul>
<--snip-->

I've reduced my code to the minimum to make the match easier to spot.

I can't make the menu work without borders on each menu item (flyouts don't appear if CSS borders removed) so think I'm going to choose something else anyway.

387 Posts

whistlemaker Reply #6, 15 years ago

Yes your code looks the same as his code. But what ottogal was saying is that it has un-needed ul tags

yours and his:

<ul class="nav">
  <li><a href="#url">Home</a></li>
</ul>
<ul class="nav">
  <li><a href="#url">Contact Us</a>
    <ul>
      <li><a href="#url">Email</a></li>
      <li><a href="#url">Telephone</a></li>
      <li><a href="#url">Online Form</a></li>
      <li><a href="#url">Snail Mail Address</a></li>
    </ul>
  </li>
</ul>

Without extra ul tags:

<ul class="nav">
  <li><a href="#url">Home</a></li>
  <li><a href="#url">Contact Us</a>
    <ul>
      <li><a href="#url">Email</a></li>
      <li><a href="#url">Telephone</a></li>
      <li><a href="#url">Online Form</a></li>
      <li><a href="#url">Snail Mail Address</a></li>
    </ul>
  </li>
</ul>

Of course 'his' css will probably (well certainly) won't work and you will probably need to add some classes and maybe ids in there to ease the writing of the css.