### jQuery Mobile Button events

There are numerous options to raise button events.
Button Show Dialog as defined in the HTML file
<!-- Button: Login dialog -->
<a data-role="button" id="btnlogin" data-ajax="false" data-mini="true" data-inline="true" data-theme="a" href="#dlglogin" data-transition=pop>Login</a>
The login dialog as defined:
<div data-role=dialog id="dlglogin" data-add-back-btn=false data-theme="e" data-overlay-theme="a" class="ui-content">
<div data-role=header>
<h1>Login</h1>
</div>
<div data-role=content>
<form name="loginform" action="" method="post">
<label for="username" class="ui-hidden-accessible">Username</label>
<input type="text" name="username" id="username" placeholder="username">
<label for="password" class="ui-hidden-accessible">Password</label>
<input type="password" name="password" id="password" placeholder="password">
</form>
</div>
<div data-role="footer">
<a data-role="button" data-mini="true" id="btnloginok">OK</a>
<a data-role="button" data-mini="true" id="btnlogincancel">Cancel</a>
</div>
</div>
Button Show Dialog with embedded HTML file
Example About dialog loading about.html.
<!-- Button: About dialog. Shows the html page about.html inline as a dialog -->
<a data-role="button" data-mini="true" href="about.html" data-inline="true" data-theme="b" data-rel="dialog" data-transition="pop">About!</a>
Option: Call b4j event straight
<!-- Button: About dialog. A B4J Event is called straight by binding the button click (see under script) -->
<a data-role="button" id="btnabout" data-ajax="false" data-mini="true" data-inline="true" data-theme="b" data-transition="pop">About!</a>
<script>
...
// Button About which raises b4j event when clicked.
// The about event calls the sub showMessage as defined in related bas file.
$("#btnabout").bind( "click", function(event, ui) {
b4j_raiseEvent("about_event", {});
});
...
</script>
Button Show About
This is a rather simple way. Define a Form for each button.
HTML
<form>
<button type="submit" id="btnabout">About</button>
</form>
B4J
Private btnAbout As JQueryElement
' Show About Message
`Private Sub btnAbout_Click (Params As Map)
ws.Alert("About this App")
End Sub`

Changed: , Category: WebApps jQuery Mobile, File: T6C282M2109.htm, ID: 2109