Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Adapter will error when href is undefined #159

Closed
caseman72 opened this Issue Apr 3, 2013 · 8 comments

Comments

Projects
None yet
3 participants

In iOS - when you click on a link that has an href it pops the address bar down. I found that if you add an link and click on it via JS it doesn't show the address bar (just change_page via ngm-vclick).

But this code - errors later when you do thisUrl.length:

thisUrl = $this.attr( "href" );

So I changed it to this:

thisUrl = $this.attr( "href" ) || "";
Contributor

tbosch commented Apr 5, 2013

Hi,
could you provide a fiddle for this? Which event are you firing on which element? If you trigger the click event on the link, it should have the href attribute set...

By the way, did you try the following approach:

var mod = angular.module('ngm', []); //setup angular app
mod.controller("MainCtrl", function($scope, $location) {
    $scope.click = function() {
        $location.url('#page2');
    }
});

and then:

    <a href="" ngm-vlclick="click()">Page2</a>

Look here: http://jsfiddle.net/ZHKBA/128/

I tried with the iOS simulator, and couldn't reproduce the address bar popping up when clicking. Neither in the normal case with a link link <a href="#page2"> nor with the example above....

Using the $.mobile.changePage directly is not recommended with the adapter. I would use the default $location mechanism of angular instead. By this, you still get history support (back button, ...), which you don't get if calling $.mobile.changePage directly...

Tobias

Contributor

tbosch commented Apr 5, 2013

Hi,
ok, I could reproduce your problem when using external jqm pages. Have a look here: http://plnkr.co/edit/4UXicZwFMjZcg2i582ZL?p=preview

The approach with using ngm-vclick and then changing $location does no more show the address bar when clicking. So you could go with a more "default" approach, instead of clicking a link programmatically.

Does this solve your problem?

Tobias

Contributor

tbosch commented Apr 5, 2013

Here is the direct link to open the plunk in an iPhone/iOS Simulator, so you can directly check if the address bar is popping down: http://run.plnkr.co/ZbwrCTw7b7iNPim6/

Did work in iOS Simulator 6...

Tobias

Apart from that I have also the problem in a normal browser. For me the fix was simply to add a check if a href attribute exists.

We don't use the $.mobile.changePage; the change_page method adds an anchor and clicks it - but we can easily try the $location method.

I still don't see the reason why you need to have href="" just as I don't like class="" in the DOM either - the check for length on an jquery method is problematic as it can return undefined.

Can you specify a transition with $location ?

Contributor

tbosch commented Apr 24, 2013

Hi,
sorry for the late reply.
You can specify a transition when using $location as follows:

        $location.routeOverride({jqmOptions: {transition: 'pop'}});
        $location.url('#page2');            

See here: https://github.com/tigbro/jquery-mobile-angular-adapter#service-location-extensions

@tbosch tbosch closed this in 6430d79 Apr 24, 2013

Contributor

tbosch commented Apr 24, 2013

Hi,
now I understood: Your external page contained an <a> tag without a href attribute. Would be easier for me next time if you could provide a jsfiddle / plunk...

Thanks for submitting this issue though!
Tobias

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment