Question

I have two dialog in a page.

<div data-role="page" id="connect" data-id="connect">
<div id="header-connect" data-role="header" data-id="bs_header" data-theme="a">
    <h1>{t}Connect{/t}</h1>
</div>
<div data-role="content">
    <ul data-role="listview">
        <li><a href="#test" data-rel="dialog">Test</a></li>
    </ul>
</div>
</div>

<div data-role="page" id="test" data-id="test">
    <div id="header-test" data-role="header" data-id="bs_header" data-theme="a">
        <h1>{t}Test{/t}</h1>
    </div>
    <div data-role="content">
       <a href="#" data-rel="back">Back</a>
       <a href="javascript:;" onclick="$('.ui-dialog').dialog('close');">Close</a>
    </div>
</div>

When i try to close the first one with javascript, it doesn’t work on Chrome and Chrome Mobile, but works with firefox. I use Jquery Mobile 1.0.1.

Do you have any advice?

Answer 1

I’ve managed to solve it using

$('*[data-icon="delete"]').on("click",function(){
   $('.ui-dialog').dialog('close');
});

Inside the dialog code… bad solution but worked for me since it was the only dialog in my case but might help you too.