progress.ui.UIHelper( JSDO-object )
|
Member
|
Brief description (See also the reference entry)
|
An object reference property on a UIHelper instance that corresponds to a table of the JSDO with which the UIHelper instance is associated.
|
Member
|
Brief description (See also the reference entry)
|
A class method that specifies a new default field format for all detail forms created with UIHelper instances in the current JavaScript session.
|
|
A class method that specifies a new default item format for all list views created with UIHelper instances in the current JavaScript session.
|
Member
|
Brief description (See also the reference entry)
|
Adds an item to a list view based on the working record of a specified table reference.
|
|
Updates a specified working record in JSDO memory with the values currently displayed on the detail page form.
|
|
Clears the items from a list view associated with a single table reference.
|
|
Copies the field values of a given record to corresponding fields in the current HTML document for display in the form on the detail page.
|
|
Reads the schema of the referenced table and returns a string containing the HTML text of field definitions created by processing a UIHelper form field template against fields that you specify.
|
|
Returns a JSRecord object for the record shown in the form on the detail page.
|
|
Returns a JSRecord object for a specified item in a list view.
|
|
Specifies the HTML page that contains the form in which item details are displayed.
|
|
Defines a list view for a referenced JSDO table.
|
|
Displays the referenced table's list view on the mobile app device or browser page.
|
<!DOCTYPE html>
<html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Customers</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> <style> /* App custom styles */ </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> <script src="../progress.session.js"></script> <script src="../progress.js"></script> <script src="customers.js"></script> </head> <body> <div data-role="page" id="custlist"> <div data-theme="b" data-role="header"> <h3>Customers</h3> </div> <div data-role="content"> <ul id="listview" data-role="listview" data-divider-theme="b" data-inset="true" data-filter="true"> </ul> </div> </div> <div data-role="page" id="custdetail" data-add-back-btn="true" data-theme="b"> <div data-role="header"><h1>Customer</h1></div> <div data-role="content"> <form action="" id="customerform"> </form> </div> </div> </body> </html> |
var customers;
var uihelper; var forminitialized = false; $(document).ready(function() { var session = new progress.data.Session(); session.login("http://localhost:8980/SportsApp", "", ""); session.addCatalog( 'http://localhost:8980/SportsApp/static/CustomerOrderSvc.json' ); customers = new progress.data.JSDO({ name: 'CustomerOrder' }); customers.subscribe('AfterFill', onAfterFillCustomers, this); uihelper = new progress.ui.UIHelper({ jsdo: customers }); uihelper.eCustomer.setDetailPage({ name: 'custdetail' }); uihelper.eCustomer.setListView({ name:'listview', format: '{CustNum}<br>{Name}<br>{State}', autoLink: true }); $('#customerform').html( uihelper.eCustomer.getFormFields() + '<input type="button" value="Add" id="btnAdd" />' + '<input type="button" value="Save" id="btnSave" />' + '<input type="button" value="Delete" id="btnDelete" />' ); customers.fill(); }); function onAfterFillCustomers() { uihelper.eCustomer.clearItems(); customers.eCustomer.foreach(function(customer) { uihelper.eCustomer.addItem(); }); uihelper.eCustomer.showListView(); } |