Question

I have a small web app that is nothing more than a few HTML pages. I wish to use the jQuery UI dialog within my app and I have it working in the browser on my Mac and PC (Sarafi, Chrome, Firefox) and I have deployed to android (Xoom 2) and all is well however the dialog is not fired when I test on the iPad (IPad 2). I’ve also noticed that the DIV which contains the dialog content is not hidden when viewing the page on the iPad.

Here’s my JS code…

$('#entry_level_phones .boxHolder').live("click", function(){

    var clickedItem = $(this).find("img")[0].id;

    console.log(clickedItem);
    // raise a modal...
    $(function() {
        $( "#dialog-modal" ).dialog({
            modal: true,
            draggable:false,
            height:600,
            position:"center",
            resizable:false,
            width:1000
        });

   // more happens here which isn't important... but there is no conflict or error
  });
});

this is the associated DIV…

<div id="dialog-modal" title="">
    <p>Hello World</p>
</div>

When testing by putting an alert() to see if the click event is being raised the test alert is executed, so it is not an issue with the click event, it is the dialog itself or jQuery UI isn’t being loaded.

I also tried to raise a dialog like this, without being associated with a DIV or an event but even this didn’t work

$( "<div>this is a test</div>" ).dialog()

Has anyone else had issues using the dialog with the iPad?

I’m not sure if this is relevant however my app is one mainHTML file that brings in HTML content using the .load() method

Answer 1

Sorry to answer my own question but I put a check in to see if the UI was being loaded…

var isiPad = navigator.userAgent.match(/iPad/i) != null;

if(!jQuery.ui && isiPad == true){
    // do stuff...
    }

I thought about dynamically appending the UI script back to the body of my webpage however I was using the hosted version of jQuery UI. When I replaced this for a local version by downloading the problem seemed to go away… thus the answer is the hosted version was taking too long to load or not loading at all. Sorry for the drama…