I have a delegated popup that is designed to display a modal on tablets and phones. Unfortunately, the modal appears to wait until the ajax call to @href is complete before it displays anything. From the docs it appears the modal should pop up with ajaxText filled in during the ajax call, but I see nothing until the popup suddenly appears. The call is predictably long enough (~5sec in development) that I know there isn't a chance that the loader isn't appearing for a split-second.
$('a.word').on(touchstart: touchWordPopup)
The following is in CoffeeScript, but follows convention from the official docs.
touchWordPopup: (event) ->
event.preventDefault()
// another function handles mouse hover popups,
// so let's disable that stuff.
$(this).off('mouseover mouseenter mouseleave')
$('#popup').jqm(
closeClass: 'close'
ajax: @href
ajaxText: '<h2>Loading...</h2>'
modal: true
).jqmShow()
HTML:
<html>
<head>...</head>
<body>
<div class='subscription'>
<a href="/words/foo" class='word'>Foo</a>
<!-- several more words... -->
</div>
<div id='popup' class='jqmWindow'></div>
</body>
</html>
I'm wondering whether delegation or CoffeeScript could be to blame, but I can't tell where the problem might be fixed.
The CoffeeScript is not to blame.
I've released jqModal 1.3.0, which immediately shows (displays) ajax enabled modals.
Documentation has been updated, and I've included an example (#5) to test for slower remote responses.
Because the equivalent of jqmShow() is now triggered immediately, if your ajax response includes elements that match closeClass, they will never attach. This is best corrected by patching jqModal and binding the event handler to the modal iteself, but for now you can use onLoad:
onLoad: function(hash){
var modal = hash.w;
$(hash.o.closeClass, modal).click(function(){
modal.jqmClose();
return false;
});
}