Delphi 8 and ASP.NET

by Charlie Calvert

What Is ASP.NET
Of WinForms and WebControls
Understanding ASP.NET Applications
Installing ASP.NET Applications
The ASPX File
The ASP.NET Form Markup
Web Controls vs HTML Controls
Veewstate
No Pascal Scripting
CodeBehind
Styles
XML Data
Database .NET Style Simple
Database Delphi Style

What is ASP.NET?

Download this document from http://www.elvenware.com/charlie/delphi/aspnet/asp-net.html
If you get to http://www.elvenware.com/charlie/delphi then you can find it from there.
The source is available at http://www.elvenware.com/charlie/delphi/aspnet/srcpasNet.zip
It is a technology for creating Web Applications
And what are Web Applications?
It is a way of transforming a web browser from a place to view static pages to a place in which applications can be run.

Of WinForms and WebControls

In .NET, there are at least two different types of controls.
There are the controls that appears in a Form or Dialog, and there are those that appear in a web browser.
ASP.NET makes it possible for a programmer to view a WebControl as a specialized type of WinControl.
ASP.NET is designed to make a programmer look at a web page as if it were a Delphi (or VB) form.
This is good because it helps the programmer use a familiar paradigm
And it also adds the power of that paradigm to web applications.

Understanding ASP.NET Applications

A web application runs inside a particular type of directory.
It works with files that have particular extensions

Installing ASP.NET Applications

Unless you are working with Mono on Linux, you will generally need to mark an ASP.NET directory in a particular manner.
Select Control Panel | Performance and Maintenance | Administrative Tools | Internet Information Services.
Or: run c:\windows\System32\inetsrv\inetmgr.exe
Use this tool to create a new virtual directory.
Create an Application Name for the virtual directory
To create an application name, bring up the properties dialog for your virtual directory, and select the Create button next to the Application Name option.

The ASPX file

Internet Information Services knows that you have an ASP.NET file if it sees an ASPX extension.
The file is still accessed through standard HTTP.

<HTML>
<HEAD>
	<TITLE>Basic HTML with simple form</TITLE>
</HEAD>
<BODY>

<H1>Basic HTML with simple form</H1>      
<form>
<P><strong>Enter name:</strong></P>
<input name="MyControl" type="text" size="30">
</form>

</BODY>
</HTML>

But when the Internet Information Services (IIS) sees the ASPX extension it treats it as an ASP.NET file.
In general terms, this means that it starts looking for markup and replacing sections that need to be changed.
Other processing also occurs that can include regular code execution or database calls

ASP.NET Form Markup

HTML: <input name="MyControl" type="text" size="30">
ASPX: <input id="MyControl" type="text" size="30" Runat="server">
Notice the use of id rather than name. And we have added Runat="server", which is the key signal to ISS.

<HTML>
<HEAD>
	<TITLE>Basic ASPX with simple form</TITLE>
</HEAD>
<BODY>

<H1>Basic ASPX with Simple Form</H1>   
   
<form runat="server">

<P><strong>Enter name:</strong></P>
<input id="MyControl" type="text" size="30" Runat="Server">

</form>

</BODY>
</HTML>

Web Controls vs HTML Controls

Here is a what an ASP.NET control looks like in markup:

    <asp:button id=Button1 
                style="Z-INDEX: 1; LEFT: 94px; POSITION: absolute; TOP: 158px" 
                runat="server" text="Button">
    </asp:button>

Viewstate

The form statement also uses the runat syntax. <form runat="server">
Let's look at the html rendered when we don't use runat with form:

<HTML>
<HEAD>
	<TITLE>Basic ASPX with simple form</TITLE>
</HEAD>
<BODY>

<H1>Basic ASPX with Simple Form</H1>   
   
<form>

<P><strong>Enter name:</strong></P>

<input name="MyControl" id="MyControl" type="text" size="30" />

</form>

</BODY>
</HTML>

Now let's see what we get when we use form runat="server"

<HTML>
<HEAD>
	<TITLE>Basic ASPX with simple form</TITLE>
</HEAD>
<BODY>

<H1>Basic ASPX with Simple Form</H1>   
   
<form name="_ctl0" method="post" action="basic01.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE" value="dDwxNzU2ODcxNTcyOzs+MGqS8R+uUAO1mfa8T/fhFsd8BHg=" />


<P><strong>Enter name:</strong></P>

<input name="MyControl" id="MyControl" type="text" size="30" />

</form>

</BODY>
</HTML>

Notice the presence of the hidden field. This is where the view state is stored
Try entering data in the input field and pressing enter. When you use form runat, the data is preserved.

Delphi Scripting in ASPX Files Not Supported, Must use CodeBehind

Here is how to do scripting in an ASPX file in C#:

<%@ Page Language="C#" %>

<SCRIPT runat="server">

void Page_Load(object sender, System.EventArgs e)
{
  Response.Write("This is the load page event");
}
</SCRIPT>

<HTML>
<HEAD>
	<TITLE>Basic ASPX with simple form</TITLE>
</HEAD>
<BODY>

<H1>Basic ASPX with Simple Form</H1>   
   
<form runat="server">

<P><strong>Enter name:</strong></P>

<input id="MyControl" type="text" size="30" Runat="Server">

</form>

</BODY>
</HTML>

The following syntax was available in the preview. At that time they said, place the following web.config file in the virtual directory for your application:

<configuration>
  <system.web>                            
    <compilation debug="true">
       <assemblies>
          <add assembly="DelphiProvider" />
       </assemblies>
       <compilers>
          <compiler language="Delphi" extension=".pas" 
            type="Borland.Delphi.DelphiCodeProvider,DelphiProvider" />   
       </compilers>
    </compilation>
  </system.web>
</configuration>

This did not make it into the shipping product, we must use CodeBehind.

Delphi 8 Update 2 and Cassini Needed to Avoid Occasional Lockups

It is a good idea to use Cassini rather than the default IIS web server.
Cassini ships with Delphi, but it ships only in source.
There is a build.bat file that ships with Delphi in the demos\cassini directory.

Make sure these two guys are on your path:

C:\WINNT\Microsoft.NET\Framework\v1.1.4322
C:\Program Files\Microsoft.NET\SDK\v1.1\Bin

Now goes to Tools | Options in the Delphi menu and select ASP.NET. Set the Path field for Cassini to point at the executable you made.
You can leave the port at the default value of 8080.
Now choose Project | Options to set Debugger | ASP.NET to the Cassini Web Server. Leave the Virtual Directory blank
When you start a new ASP.NET project, you will also get a chance to choose which server you want to use.
If you get locked up, try using this tip from the news groups: hit Ctrl+Alt+Del and kill the aspnet_wp.exe process .. this could/should help. At least it helps me.

Codebehind

When you start a Delphi project, by default, it creates a WebForm1.aspx file and WebForm1.pas file.

At the top of WebForm1.aspx you see this:

<%@ Page language="c#" Debug="true" Codebehind="WebForm1.pas" AutoEventWireup="false" Inherits="WebForm1.TWebForm1" %>

Note the Inherits and Codebehind attributes.

Here is the code that Delphi generates by default for CodeBehind:

procedure TWebForm1.InitializeComponent;
begin
  Include(Self.Button1.Click, Self.Button1_Click);
  Include(Self.Load, Self.Page_Load);
end;

procedure TWebForm1.Page_Load(sender: System.Object; e: System.EventArgs);
begin
  // TODO: Put user code to initialize the page here
end;

Let's enter some code:

Response.Write('This is the page load message.');

Now, let's try this code;

if not IsPostBack then 
  Response.Write('This is the page load message.');

The difference appears when you hit the post button. IsPostBack means, in effect, have you hit the submit button and are you getting data back from the server.

Intro to Web Controls: Styles

Styles are a feature of .NET that allow you to change the appearance of a control.
Suppose we drop down a list box, text control and button on a form.

Now write this code in the Load_Page method:

var
  MyStyle: Style;
begin
  MyStyle := Style.Create();
  MyStyle.BackColor := Color.Green;
  MyStyle.ForeColor := Color.Yellow;
  MyStyle.BorderStyle := BorderStyle.Dashed;
  TextBox1.ApplyStyle(MyStyle);
  ListBox1.CssClass := 'MyLook';
  Button1.ApplyStyle(MyStyle);
end;

Accessing an XML File

Now that you understand a little bit of what ASP.NET is all about, let's start showing it's real powerl.
As you now, running in the background is .NET. And .NET includes an incredibly powerful set of classes for handling many of the tasks that programmers face.
Because you are working in ASP.NET, you have access to all of that code.
In a sense you have the full power of the VCL available to you in a web browser, only this is not just the VCL, but all of .NET that is at your fingertips.
And .NET just keeps growing and getting more powerful.
As an example of its power, look at this code, for reading in an XML file:

var
  Names: DataSet;
  FileName: String;
begin
  Names := DataSet.Create();
  FileName := System.Web.HttpContext.Current.Server.MapPath('names.xml');
  Names.ReadXml(FileName);
  DataGrid1.DataSource := Names;
  DataGrid1.DataBind;
end;

Database Simple

Here is how to do it in code.

procedure TWebForm1.Button1_Click(sender: System.Object; e: System.EventArgs);
var
  MyConnection: SqlConnection;
  MyDataSet: DataSet;
  MyDataAdapter: SqlDataAdapter;
begin
  MyConnection := SqlConnection.Create('Server=localhost;Integrated Security=SSPI;database=pubs' );
  MyConnection.Open();
  MyDataAdapter := SqlDataAdapter.Create('Select * From Authors', MyConnection);
  MyDataSet := DataSet.Create();
  MyDataAdapter.Fill(MyDataSet, 'Products');
  DataGrid1.DataSource := MyDataSet;
  DataGrid1.DataBind();
end;

Database Delphi Style

Let's use some Delphi web tools to create a database application
Choose File | New Asp.Net Web Application from the Delphi menu.
Choose the defailts in the Wizard, except I suggest using the Cassini Web Server
To make sure the IDE is set up right, I suggest choosing View | Desktops | Default layout from the Delphi menu.
Near the the upper right hand of the IDE, choose Data Explorer.
Open up one of the nodes in the Data Explorer and select a table.
Drag the table onto the Designer
A BdpConnection and BdpDataAdapter will appear at the bottom of the designer.
Drag a DBWebDataSource into the same area as the BdpConnection and BdpDataAdapter.
Click on the BdpDataAdapter and select Generate Typed DataSet on the bottom left of the IDE, beneath the Inspector.
Take all the defaults in the dailog that appears, and click ok.
A DataSet will be generated and will appear next to the DBWebDataAdapter.
Click on the DBWebDataAdapter and set its DataSet property to the new DataSet you just created.
Set the DBWebDataAdapter's active property to true.
Connect the DataSource property of the DataSource to the DataSet
Drag a DBWebGrid and DBWebNavigator onto the designer.
Fill in the DataSource and TableName properties of the DBWebGrid.
Do the same with the DBWebNavigator.
Run the Application.