×

Discussion Board

Results 1 to 2 of 2
  1. #1
    Registered User
    Join Date
    May 2013
    Posts
    2

    mh5 and jquery mobile: problem creating a second map on a second page.

    Hi again,
    I'm having a second problem:

    I'm using jQuery mobile, I have two pages, both of which contain an mh5 Map Widget.

    First, I enter page A.
    On the 'pagecreate' event, I create a map object and display it:
    Code:
            var settings = {
                settingsButton: null,
                infoBubble: {
                    content: ["title", "description"],
                    right: "/mobile/css/images/okbtn.png",
                    rightDelimiter: true,
                    listeners: {
                        click: function(e) {
                            console.log(e);
                        },
                        rightclick: function() {
                            console.log('rightclick');
                        }
                    }
                }
            };
            var map = new nokia.mh5.components.Map(settings);
    
            $('#mapContainerA').empty().append(map.root);
    then I create some POI:
    Code:
    var poi = map.createPoi(options.poiImage, {
                        longitude: loc.longitude,
                        latitude: loc.latitude,
                        content: ["title", "description"],
                        name: place.street + " " + place.houseNo,
                        description: place.postcode + " " + place.place
                    });
    This works like a charm. Clicking on a POI opens the infoBubble, and clicking on the infoBubble triggers the events.


    However, if I change to page B, I run into problems.
    The code for this page is exactly the same except the ID for the map object - it's 'mapContainerB' instead of 'mapContainerA'.

    Unfortunately, on this page, clicking on the Map does not open infoBubbles. And after opening the infoBubbles with
    Code:
    map.showInfoBubble(poi);
    neither the click event nor the rightclick event do trigger.

    Same scenario other way round:
    Refresh the page, start with page B: page B works like a charm. Go to page A: click events broken. I can move around the map without problems, but infoBubbles have the same problems as described above.



    As you might know, jQuery mobile does not reload the web page upon changing. It keeps the old page in the DOM and loads a new page additionally.
    This might lead to all funny kinds of global variable collisions or object ID collisions.
    For my own pages, I've made sure, this doesn't happen, but of course I can't do that for mh5.

    Is there any function to completely eradicate all mh5-associated divs, canvas elements, javascript global variables, whatever else you might think of, to prevent that?

    Or is the solution even much more easier and I just don't see it?

  2. #2
    Registered User
    Join Date
    Nov 2012
    Posts
    6

    Re: mh5 and jquery mobile: problem creating a second map on a second page.

    I believe the problem with the second map is that its not receiving the click event at the right point. This has happened to me before, when I append the map on pagebeforeshow event the poi's don't seem to receive the click events. I believe the problem was with the header, I noticed that if I clicked above the poi (the distance was about the height of the header) the info bubble would show. The way I got around it was to append the map at pageshow or enhance the jquery mobile page before calling changePage.

Similar Threads

  1. Can I use jQuery Mobile and WRT?
    By hiad in forum Symbian
    Replies: 2
    Last Post: 2011-12-16, 08:00
  2. jQuery mobile
    By lucassp in forum Symbian
    Replies: 8
    Last Post: 2010-11-22, 10:18
  3. jQuery, HTML page (not wgz), JS not working
    By rkoberg in forum Symbian
    Replies: 1
    Last Post: 2010-05-30, 12:51
  4. Problem in creating multi-page dialog
    By yogesh.sharma in forum Symbian
    Replies: 1
    Last Post: 2007-09-13, 08:40

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
×