1

I am unable to preview my sample mobile page in Firefox on Android which has been developed using notes 9. Seems Dojo 1.8 not compatible with Mozilla in Android. I did the same logic using Dojo 1.8.3. It works fine in iPad and Blackberry, but not with Mozilla in Android. its work well in native browser and chrome in Android. Even its not working with Chrome desktop browser with Android user agent

  • Does anyone face the same issue?
  • How can I resolve the issue?
  • To reproduce the issue. Open the following URL and change user agent to Android and check.
  • Same thing works well both chrome with android UA and Firefox in android Tab when upgrade Dojo version to 1.9. But i need to get work with Dojo 1.8.1 since new Domino 9 have Dojo 1.8

Click here for the demo: Dojo 1.8 demo

The JavaScript:

  dojo.require('dojox.mobile.parser')
  dojo.require('dojox.mobile.deviceTheme')
  dojo.require('dojox.mobile')
  dojo.require('dojox.mobile.FixedSplitter')
  dojo.require('dojox.mobile.ScrollableView')
  dojo.ready(
       function()
       {
         dojox.mobile.parser.parse()
        }
 )

The HTML:

<div dojoType="dojox.mobile.FixedSplitter">
    <div dojoType="dojox.mobile.Container"
         id="landscape" style="width:200px;border-right:1px solid black">
             <h1 dojoType="dojox.mobile.Heading" fixed="top"
                 class="mblHeadingLeft"></h1>
             <div id="mainMenu" dojoType="dojox.mobile.ScrollableView"
            selected="true">
            <ul dojoType="dojox.mobile.EdgeToEdgeList"
                transition="slide" stateful="true">
                <li dojoType="dojox.mobile.ListItem" moveTo="Contact"  label="Contact" selected="true"></li>
                <li dojoType="dojox.mobile.ListItem" moveTo="AccountInfo" label="Account Info"></li>
                <li dojoType="dojox.mobile.ListItem" moveTo="ContactInfo" label="Contact Info"></li>
                <li dojoType="dojox.mobile.ListItem" moveTo="Social" label="Social"></li>
                <li dojoType="dojox.mobile.ListItem" moveTo="PersonalInfo" label="Personal Info"></li>
                <li dojoType="dojox.mobile.ListItem" moveTo="PersonalInfo" label="Comments"></li>
                <li dojoType="dojox.mobile.ListItem" moveTo="PersonalInfo" label="Additional"></li>
            </ul>
        </div>
    </div>

    <div dojoType="dojox.mobile.Container">
        <h1 dojoType="dojox.mobile.Heading" fixed="top" label="Contact" class="mblHeadingRight">
        <span dojoType='dojox.mobile.ToolBarButton'>Navigation</span> 
            <span dojoType='dojox.mobile.ToolBarButton' style="float:left" > Back </span>
            <span dojoType='dojox.mobile.ToolBarButton'> HI </span>
            <span dojoType='dojox.mobile.ToolBarButton'>Back </span>

        </h1>
        <div id="fullFrame">



            <div id="Contact" dojoType="dojox.mobile.ScrollableView"
                selected="true">
            Contact
            </div>
            <div id="AccountInfo"
                dojoType="dojox.mobile.ScrollableView"
                selected="false">
                Account Info
            </div>
            <div id="ContactInfo"
                dojoType="dojox.mobile.ScrollableView"
                selected="false">
                 Contact Info               
            </div>
            <div id="Social" dojoType="dojox.mobile.ScrollableView"
                selected="false">
            Social
            </div>
            <div id="PersonalInfo"
                dojoType="dojox.mobile.ScrollableView"
                selected="false">
            Personal Info
            </div>
            <div id="Comments"
                dojoType="dojox.mobile.ScrollableView"
                selected="false">

            </div>
            <div id="Additional"
                dojoType="dojox.mobile.ScrollableView"
                selected="false">

            </div>


        </div>
        <div id="PopUpPanels">


        </div>
    </div>
</div>    
TessellatingHeckler
  • 27,511
  • 4
  • 48
  • 87
  • 1
    Could you be more specific than "not working". What do you expect to happen, what happens instead. Your sample also doesn't display right with a desktop Firefox. – stwissel Jul 08 '13 at 19:31

1 Answers1

0

A few pointers:

  • Send your code through a Validator (looks OK
  • Make sure you selected HTML5 as property in the XSP properties
  • Be nice and put ; at the end of your lines in JavaScript (I once spend 2h debugging since one browser was OK without and the other wasn't)
  • make sure you use the XPage properties and not passthu HTML for your dojo.require
stwissel
  • 20,110
  • 6
  • 54
  • 101
  • Thanks stwissel. I have pasted my notes 9 code below. I like to make work device theme feature in dojo 1.8.1 with notes 9. But its not work for me when Android UA in chrome? whether i am doing any thing wrong here? As you said its not working in firebox on desktop. I dont need to worry about for desktop. All i want to work on different mobile device(ipad/android tab) and desktop brwoser with UA to test. – Mahendran Rathinam Jul 09 '13 at 07:08
  • The Android browser behaves differently than a desktop chrome browser that you tweak the UA string. To see what is really happening use a real device - or - use the free Android emulator. Does it happen there too? – stwissel Jul 09 '13 at 09:28
  • 1
    For non-webkit browsers such as Firefox, you should require additionally dojox.mobile.compat. See this [documentation](https://dojotoolkit.org/reference-guide/1.8/dojox/mobile/cross-browser-support.html). – Adrian Vasiliu Jul 29 '13 at 09:31