AppML チュートリアル
/ AppML 案例模板
AppML 案例模板
此案例研究演示了如何構(gòu)建一個完整的 <AppML> 互聯(lián)網(wǎng)應(yīng)用程序,具有針對數(shù)據(jù)庫中的若干表進(jìn)行信息列舉、編輯和搜索的功能。
添加 HTML 模板
在本章中,我們將演示如何向 HTML 頁面添加 HTML 模板。
列出客戶
實例
HTML - View <h1>Customers</h1> <div id="List01"></div><br> <table id="Template01" class="appmltable" style="display:none"> <tr> <th>Customer</th> <th>City</th> <th>Country</th> </tr> <tr id="appml_row"> <td>#CustomerName#</td> <td>#City#</td> <td>#Country#</td> </tr> </table> <script src="appml.js"></script> <script> var customers customers=new AppML("appml.php","Models/Customers"); customers.run("List01","Template01"); </script>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
列出客戶和客戶表單
通過巧妙地使用模板,可以很容易添加 <AppML> 列表對象和 <AppML> 表單之間的鏈接:
實例
HTML - View <h1>Customers</h1> <div id="Form01"></div><br> <div id="List01"></div><br> <table id="Template01" class="appmltable" style="width:100%;display:none"> <tr> <th></th> <th>Customer</th> <th>City</th> <th>Country</th> </tr> <tr id="appml_row"> <td style="cursor:pointer" onclick="openForm('#CustomerID#')"> <img src="../style/images/appmlFolder.png"></td> <td>#CustomerName#</td> <td>#City#</td> <td>#Country#</td> </tr> </table> <script src="appml.js"></script> <script> var customers,customerForm; customers=new AppML("appml.php","Models/Customers"); customers.run("List01","Template01"); function openForm(id) { customerForm=new AppML("appml.php","Models/Customers"); customerForm.displayType="form"; customerForm.run("Form01","",id); } </script>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
列出客戶和客戶訂單
通過巧妙地使用模板,可以很容易添加 <AppML> 列表對象和所鏈接的列表之間的鏈接:
實例
HTML - View <h1>Customers</h1> <div id="List01"></div><br> <div id="Orders01"></div><br> <table id="Template01" class="appmltable" style="width:100%;display:none"> <tr> <th>Customer</th> <th>City</th> <th>Country</th> <th></th> </tr> <tr id="appml_row"> <td>#CustomerName#</td> <td>#City#</td> <td>#Country#</td> <td><a href='' onclick='openOrders("#CustomerID#");return false;'>Orders</a></td> </tr> </table> <table id="Template02" class="appmltable" style="width:100%;display:none"> <tr> <th>Customer</th> <th>Date</th> <th>Salesperson</th> <th>Shipper</th> </tr> <tr id="appml_row"> <td>#CustomerName#</td> <td>#OrderDate#</td> <td>#Salesperson#</td> <td>#ShipperName#</td> </tr> </table> <script src="appml.js"></script> <script> var customers,orders; customers=new AppML("appml.php","Models/Customers"); customers.run("List01","Template01"); function openOrders(id) { orders=new AppML("appml.php","Models/Orders"); orders.setQuery("orders.customerid",id); orders.commands=false; orders.run("Orders01","Template02"); } </script>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
現(xiàn)在把所有的合并在一起
最后,通過少量代碼復(fù)制,我們就可以完成項目。
實例
客戶列表、表單和訂單 <h1>Customers</h1> <div id="List01"> <table id="appml_list" class="appmllist"> <tr> <th>Customer</th> <th>City</th> <th>Country</th> <th></th> </tr> <tr id="appml_row"> <td>#CustomerName#</td> <td>#City#</td> <td>#Country#</td> <td><a href='' onclick='openOrders("#CustomerID#");return false;'>Orders</a></td> </tr> </table> </div> <div id="List02"></div> <script src="appml.js"></script> <script> var Customers,Orders Customers=new AppML("appml.php","Models/Customers"); Customers.run("List01"); function openOrders(id) { var Orders=new AppML("appml.php","Models/Orders"); Orders.setQuery("orders.customerid",id); Orders.commands=false; Orders.run("List02"); } </script>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
在接下來的章節(jié)中,您可以看到更多帶有完整源代碼的應(yīng)用程序。