Jump to:

10851 Posts in 2517 Topics by 1793 members

All other Modules

SilverStripe Forums » All other Modules » Mobile module jquery navigation hack

Discuss all other Modules here.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 573 Views
  • Spaghetti
    Avatar
    Community Member
    31 Posts

    Mobile module jquery navigation hack Link to this post

    Hello,

    I've been hacking the jquery mobile theme which comes with the mobile module, to get it to work properly. I'll explain why and what I've been doing but first, here's my site structure:

    Home
    Portfolio
    -- Portfolio Project 1
    -- Portfolio Project 2
    Contact
    ...etc

    So the problem I've been having is when you visit a nested page, it seems to 'forget' where the home page is and if I go into the portfolio project 2 and then click back to 'home', it takes me to 'portfolio' instead. Also, if I click from projects to contact and then click home, it takes me to portfolio! I'm confused because the page source still shows the right address. I think it's ajax issue.

    On the jquery mobile site, it says something about 'all links must end with a slash in order to be fetched with ajax' - fair enough, but they all are.

    Anyway, I have got a work-around, but I don't like it too much, because it involves sticking 'home/' on the end of the address bar, which looks kind of ugly but it's preferable to messing up navigation. So here's my fix if anyone's interested. It will probably save you hour of stress:

    in the navigation.ss file:

    <% if URLSegment == home %>
    <li class="$LinkingMode">
    <a href="{$AbsoluteLink}home/" data-role="button" data-transition="flip"
    class="<% if isSection %>ui-btn-active<% end_if %>">
    $MenuTitle
    </a>
    </li>
    <% else %>

    ...etc

    and you do a similar thing to the home button on the page.ss page:

    <a href="{$Page(home).AbsoluteLink}home/" data-role="button"    data-icon="home" data-iconpos="notext" data-transition="flip">   Home </a>

    Hope that helps but if anyone has a better idea, I'm all ears...?

  • pali
    Avatar
    Community Member
    33 Posts

    Re: Mobile module jquery navigation hack Link to this post

    Hello,

    same issue here, fixed as following (place in Page_Controller):

          function HomePageLink() {
             return trim($this->BaseHref(),"/");
          }

    and in SS theme calling $HomePageLink in href attribute...

    It looks like jquery mobile detects any first loaded page as a equivalent to homepage "/".

    573 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.