AppML How To

## AppML Basic

AppML HOME AppML How To AppML Download AppML Architecture AppML Reference

## AppML Case Study

Case Intro Case Prototyping Case Models Case Templates Case Employees Case Customers Case Products Case Future

## Tutorials

WebSites

# <AppML> How To

« Previous
Next Chapter »

This chapter demonstrates how to create an <AppML> application in 4 easy steps.

The next chapter explains how to download <AppML>, and immediately start developing web applications on your own computer.

## 1. Create a Model

Create a file with the following content:

<appml>
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT CustomerName,ContactName,City,Country FROM Customers</sql>
<orderby>CustomerName</orderby>
</database>
</datasource>
<filters>
<query>
<field>CustomerName</field>
</query>
</filters>
</appml>

Save the file as Customers.xml in a subfolder called Models (we suggest).

## Model Explained

The <appml> tag defines a model.

The <datasource> tag defines the model's datasource.

The <database> tag defines a database.

The <connection> tag defines the database connection.

The <sql> tag defines the data to be selected.

The <orderby> tag defines the default sort order.

The <query> tag defines legal query filters.

## 2. Create a Web Page

For your first <AppML> app, create an HTML page:

## Example

<!DOCTYPE html>
<html>
<body>
<h1>My First Web Application</h1>
<table>
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Berlin</td>
<td>Germany</td>
</tr>
</table>
</body>
</html>
Try it yourself »

## 3. Add Some Style

Add a stylesheet to your web page to run the <AppML> app:

## Example

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="appml.css">
</head>
<body>
<h1>My First Web Application</h1>
<table class="appmltable">
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Berlin</td>
<td>Germany</td>
</tr>
</table>
</body>
</html>
Try it yourself »

## 4. Add a Script, and Run Your Application

Add a script to your web page to run the <AppML> app:

## Example

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="appml.css">
</head>
<body>
<h1>My First Web Application</h1>
<div id="Place01">
<table id="Template01" class="appmltable">
<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>
</div>
<script src="appml.js"></script>
<script>
app=new AppML("appml.aspx","Models/Customers.xml");
app.run("Place01","Template01");
</script>
</body>
</html>
Try it yourself »

## Example Explained

The <AppML> library has lots of functions. These functions can be called from your web page.

<script src="appml.js"> loads the <AppML> library into your HTML page.

The JavaScript statement: app=new AppML("appml.aspx","Models/Customers.xml"); creates an AppML application object, running the a web service called "appml.aspx" against the model "Customers.xml".

The JavaScript statement app.run("Place01","Template01"); runs the application inside the HTML element with id="Place01", using the HTML element with id="Template01" as a template.

The attribute id="appml_row" defines the HTML element to be repeated for each data row.

Data names between # signs will be replaced with data from the model.

That's all. Can you imagine faster prototyping?

## How Does it Work?

- When a web page loads, you can load an <AppML> controller into the page.
- With the <AppML> controller, you can create an <AppML> object on your page.
- When you run the <AppML> object, it asks a controller on your server for data.
- The <AppML> object receives the data (with a data model) from the server.
- The <AppML> object (or your code) displays the data in your web page.
- (Optionally) A web user can change the data.
- (Optionally) <AppML> can send data back to the server.
- (Optionally) The server controller can store data on the server.

## Typical Web Files and Folders:

Your web folder: Demo

Your data folder: Data

Your images folder: Images

Your models folder: Models

Your application: Demo.htm

Your stylesheet: Demo.css

<AppML> configuration: appml_config.php (or .aspx)

<AppML> stylesheet: appml.css

<AppML> browser controller: appml.js

<AppML> server controller: appml.php (or .aspx)

## No Restrictions

You can put <AppML> objects inside any HTML page. <AppML> does not interfere with other parts of the page.

<AppML> defaults to standard display solutions, only if solutions don't exist. This is perfect for rapid prototyping.

But <AppML> is not primarily about display. <AppML> is about fetching data for your application. It brings data and a data model to your page. You have full HTML, CSS, and JavaScript freedom. You can:

- Write the HTML yourself, and let AppML handle the rest.
- Call the model yourself, and handle all the display yourself.
- Create any other combination, using AppML properties and methods.

You will soon discover that the power of <AppML>, and its ability to provide your web applications with data and data models. You can:

- Define data security for users and groups
- Connect to all kinds of databases, like Access, MySQL, SQL, and Oracle
- Connect to XML Files and Text Files
- Define data types, data formats, and data restrictions
- Add any new elements to the model

Read the reference to discover what <AppML> can do for you!

« Previous
Next Chapter »

## Your suggestion:

Your E-mail (optional):

Page address:

Description:

Close [X]

## Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

## WEB HOSTING

Best Web Hosting UK Reseller Hosting Wow! $5 SSD Hosting

## WEB BUILDING

Download XML Editor
FREE Website BUILDER FREE Website Creator

## WEB RESOURCES

Web Statistics Web Validation

## SHARE THIS PAGE