javascript - jQuery mobile dialog not closing as it should be by default -
has following dialog definition:
<div data-role="dialog" id="operator-delete" data-theme="b" data-title="delete record"> <div data-role="header" data-theme="b"> <h2>confirm deletion</h2> </div> <div data-role="content"> <p><div id="delete-confirm">do want delete record?</div></p> <table border="0" cellspacing="30" width=100%> <tr> <td valign="center" halign="left"><a href="#" id="delete-cancel" data-role="button" data-inline="true" data-theme="b" data-rel="back" data-icon="arrow-l">no</a></td> <td valign="center" halign="right"><a href="#" id="delete-confirm" data-role="button" data-inline="true" data-theme="b" data-icon="delete">yes</a></td> </tr> </table> </div> <!-- /content --> </div> <!-- /dialog -->
this dialog called jquery button:
<a href="#operator-delete" data-rel="dialog" data-transition="pop" id="delete-user" data-role="button" data-inline="true" data-theme="b" data-icon="delete" class="ui-btn-right">delete</a>
dialog appeared required, not react on "no" button , close button in dialog header. meantime jquery doc said: "when link clicked within dialog, framework automatically close (!!!) dialog...". saw jquery samples sources - don't put additional efforts close sample dialogs. what's wrong?
i implemented code, didn't had issue closing dialog. please check fiddle. feel there wrong html structure.
<div data-role="page"> <div data-role="content"> <a href="#operator-delete" data-rel="dialog" data-transition="pop" id="delete-user" data-role="button" data-inline="true" data-theme="b" data-icon="delete" class="ui-btn-right">delete</a> </div> </div> <div data-role="dialog" id="operator-delete" data-theme="b" data-title="delete record"> <div data-role="header" data-theme="b"> <h2>confirm deletion</h2> </div> <div data-role="content"> <p> <div id="delete-confirm">do want delete record?</div> </p> <table border="0" cellspacing="30" width=100%> <tr> <td valign="center" halign="left"><a href="#" id="delete-cancel" data-role="button" data-inline="true" data-theme="b" data-rel="back" data-icon="arrow-l">no</a> </td> <td valign="center" halign="right"><a href="#" id="delete-confirm" data-role="button" data-inline="true" data-theme="b" data-icon="delete">yes</a> </td> </tr> </table> </div> <!-- /content --> </div> <!-- /dialog -->
Comments
Post a Comment