AppML 案例模板

收藏589

阅读12707

更新时间2022-04-19


此案例研究演示了如何构建一个完整的 <AppML> 互联网应用程序,具有针对数据库中的若干表进行信息列举、编辑和搜索的功能。


添加 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>

运行实例 »

点击 "运行实例" 按钮查看在线实例



现在把所有的合并在一起

最后,通过少量代码复制,我们就可以完成项目。

实例

客户列表、表单和订单
<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>

运行实例 »

点击 "运行实例" 按钮查看在线实例

在接下来的章节中,您可以看到更多带有完整源代码的应用程序。



科技资讯

更多

精选课程

更多
前端入门_HTML5
前端入门_HTML5

共29课时

61.7万人学习

CSS视频教程-玉女心经版
CSS视频教程-玉女心经版

共25课时

39.3万人学习

JavaScript极速入门_玉女心经系列
JavaScript极速入门_玉女心经系列

共43课时

70.9万人学习

独孤九贱(1)_HTML5视频教程
独孤九贱(1)_HTML5视频教程

共25课时

61.6万人学习

独孤九贱(2)_CSS视频教程
独孤九贱(2)_CSS视频教程

共22课时

23万人学习

独孤九贱(3)_JavaScript视频教程
独孤九贱(3)_JavaScript视频教程

共28课时

33.9万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时

125万人学习

关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号