current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite
2

I have a backbone app using jquery mobile. I am trying to use a dialog popup however the problem is when i click the link #popupSuccess it doesn't activate the modal because i assume backbone is trapping it. Any ideas?

This is my modal code

<a class="modalLink" id="modalSuccessTrigger" href="#popupSuccess" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-transition="pop" data-icon="delete" data-theme="b">Success</a>

<div data-role="popup" id="popupSuccess" data-overlay-theme="a" data-theme="c" data-dismissible="false" style="max-width:400px;" class="ui-corner-all modalLinkCont">
    <div data-role="header" data-theme="a" class="ui-corner-top">
        <h1>Correct!</h1>
    </div>
    <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content" style="background-color:white">
        <h3 class="ui-title">That is correct. Tap to continue to level 2</h3>
        <a href="#" data-role="button" data-inline="true" data-rel="back" data-transition="flow" data-theme="b">Contineu</a>
    </div>
</div>
share|improve this question
1  
Please post the relevant JavaScript. –  Colin Mar 18 '13 at 2:10
 
@ScootaP you should trap the link click with the view events {"a click":"activateModal"} where activateModal is a method on the view that handles the modal display ex: $("#modaldiv").dialog() –  Deeptechtons Mar 18 '13 at 9:07
 
Based on your markup above, you've encountered difficulties opening a popup right? –  Omar Mar 18 '13 at 10:12
add comment

2 Answers

up vote 4 down vote

You need to programmatically initiate the popup:

In your backbone view:

events: {
   'click #modalSuccessTrigger': 'openPopUp'
},

openPopUp: function(e) {
   e.preventDefault()
   $('#modalSuccessTrigger').popup('open')
}

for more details refer to doc: http://jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/popup/index.html

share|improve this answer
 
It's a Popup ;) –  Omar Mar 18 '13 at 10:09
 
oh correct - daym ! –  nEEbz Mar 18 '13 at 10:12
add comment
up vote 0 down vote

To handle this issue I use to prevent the backbone routing and activate the popup handling for links marked as data-rel="popup"

$(document).ready(function(){
  ($('a[data-rel="popup"]')).on('click', function(event) {
    event.preventDefault();
    event.stopImmediatePropagation();
    var target = $(this).attr("href");
    $(target).popup('open');
  });
});
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.