jQM - Complex page create

by Dragan Gaić

HTML

<!DOCTYPE html>
<html>
<head>
    <title>jQM Complex Demo</title>
    <meta name="viewport" content="width=device-width"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>    
</head>
<body>
    <div data-role="page" id="index">
        <div data-theme="a" data-role="header">
            <h3>
                First Page
            </h3>
            <a href="#second" class="ui-btn-right">Next</a>
        </div>

        <div data-role="content" id="entries">
            <a href="#" data-role="button" id="test-button">Test button</a>
        </div>

        <div data-theme="a" data-role="footer" data-position="fixed">

        </div>
    </div>   
</body>
</html>

JavaScript

$('#index').live('pagebeforeshow',function(e,data){    
  for (i=1; i<=5; i++) {
    var h = "";    
    h += "<div>Entry #" + i + "</div>";
    h += "<div class='ui-grid-a'>";
    h += "<div class='ui-block-a'><input type='button' value='Approve' onclick='return approveButton_Click(this);' id='approve" + i + "'></div>";
    h += "<div class='ui-block-b'><input type='button' value='Reject' onclick='return rejectAbuse_Click(this);' id='reject" + i + "'></div>";
    h += "</div><hr />";
    $("#entries").append(h);
  }
  $("#index").trigger("pagecreate");
});