AppML Tutorial
/ AppML 案例原型
AppML 案例原型
此案例研究演示了如何構(gòu)建一個(gè)完整的 <AppML> 互聯(lián)網(wǎng)應(yīng)用程序,具有針對數(shù)據(jù)庫中的若干表進(jìn)行信息列舉、編輯和搜索的功能。
原型
在本章中,我們將為數(shù)據(jù)庫中的每個(gè)表建立一個(gè)原型模型。
原型是非常便于使用的開發(fā)應(yīng)用程序的起點(diǎn)。
原型模型
首先,為原型創(chuàng)建一個(gè)文件夾。該文件夾命名為 Prototypes。
然后,為數(shù)據(jù)庫中的每個(gè)表創(chuàng)建一個(gè)原型模型。
使用 SELECT * from 每個(gè)表,并保存模型為 XML 文件:
模型:Proto_Customers.xml
<appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT * FROM Customers</sql>
</database>
</datasource>
</appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT * FROM Customers</sql>
</database>
</datasource>
</appml>
模型:Proto_Suppliers.xml
<appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT * FROM Suppliers</sql>
</database>
</datasource>
</appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT * FROM Suppliers</sql>
</database>
</datasource>
</appml>
模型:Proto_Products.xml
<appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT * FROM Products</sql>
</database>
</datasource>
</appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT * FROM Products</sql>
</database>
</datasource>
</appml>
原型視圖
創(chuàng)建一個(gè)原型視圖,把它保存為 Demo_Prototype.html,并嘗試一下:
實(shí)例
視圖:Demo_Prototype.htm <h1>Customers</h1> <div id="List01"></div> <script src="appml.js"></script> <script> customers=new AppML("appml.php","Prototypes/Customers"); customers.run("List01"); </script>
運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
現(xiàn)在把所有的合并在一起
最后,通過少量 JavaScript 編碼,為所有原型模型創(chuàng)建一個(gè)簡單的原型頁面:
實(shí)例
Demo_Prototype_Views.htm <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="appml.css" /> </head> <body> <h1>Demo Applications</h1> <button onclick='myOpen("Customers")'>Customers</button> <button onclick='myOpen("Products")'>Products</button> <button onclick='myOpen("Suppliers")'>Suppliers</button> <button onclick='myOpen("Shippers")'>Shippers</button> <button onclick='myOpen("Categories")'>Categories</button> <button onclick='myOpen("Employees")'>Employees</button> <button onclick='myOpen("Orders")'>Orders</button> <button onclick='myOpen("OrderDetails")'>OrderDetails</button> <br><br> <div id="Place01"></div> <script src="appml.js"></script> <script> function myOpen(pname) { var app_obj app_obj=new AppML("appml.php","Prototypes/" + pname); app_obj.run("Place01"); } </script> </body> </html>
運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例