IntelliSense, Debug, Html and Aspx

Tornado works with Notepad as well as Visual Studio. User using the classic ASP-db tends to generate the .aspx the same way as the .asp file and because the ASP-db.Net aspx file is usually very small and the need of using an expensive IDE tool like Visual Studio seems not necessary. Actually, there is a lot of good features in Visual Studio that can be used in conjunction with Tornado to save a lot of development time. So, use VS if it is available to you. The following outlines the setup procedures -

1. Confirm Tornado.dll is installed in the \bin directory.
2. Activate Visual Studio.
3. File | New| Project | Visual Basic Projects | ASP.NET Web Application.
4. Make sure the new project is under the root and parallel to or below the /bin directory.
5. Right Click on Reference - Add Refrences - Browser
6. Navigate to the /bin directory and select Tornado.dll.
7. Click on WebForm1.aspx (Start Page).
8. Double click on the Design page. You'll see the following shell ->
   Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
           'Put user code to initialize the page here
   End Sub
9. Replace the comment line with the folloing code ->
           Dim Mydb as New Tornado.Z
10. When you type the 'Dot', all the method classes of Tornado will be shown in a listbox. If there is no show then check the following -
    Tools | Options | Text Editor | Basic | General | Auto list members (should be checked)
11. Type Mydb.dbUnit = 1. Again, all the properties will show as soon as the "Dot" is typed.
12. Continue to complete the code and select the properties from the Intellisense autolist using the space bar or the enter key -
            Dim Mydb as New Tornado.Z
            Dim GD as New Tornado.GetData
            Mydb.dbUnit = 1
            Mydb.dbDSN = "NWIND"
            Mydb.dbSQL = "Select * from orders"
            Mydb.ASPdbNET()
            Response.write("Hello World")
    Now you realize that property/method names typos are eliminated. Property case is auto adjusted and line indentation is automatic. Hit <F5> to execute the code - Done for now!
13. Exit and place a break point in Mydb.Unit = 1 (left click on the left side gray column). Hit <F5> again. Now you can step  through each line of code and perform your debug.
14. When the current program line reaches the last "Response.Write" line. Got to the command window. If you see the '>', type 'immed' to get to the immediate command mode. Type ?GD. and select Get_ActiveSQL from the list. You'll see "Select * from orders". This debug feature is very valuable and can save a lot of development time.
15. Cut the program lines between the 'Private Sub' and the 'End Sub' and paste that in the ASPX shell -
            <script language="VB" runat="server">
                Sub Page_Load(Src As Object, E As EventArgs)
                '...code
                End Sub
            </script>
16. You'll end up with the following code. ->
            <script language="VB" runat="server">
            Sub Page_Load(Src As Object, E As EventArgs)
                Dim GD As New Tornado.GetData
                Dim Mydb As New Tornado.Z
                Mydb.dbUnit = 1
                Mydb.dbDSN = "NWIND"
                Mydb.dbSQL = "Select * from orders"
                Mydb.ASPdbNET()
            End Sub
            </script>
17. Save the code as -> /tornado/scratch/Test.aspx.
18. Load the aspx file from the browser -> http://localhost/tornado/scratch/Test.aspx. Execute and done! From here on, you have produced a stand alone ASPX file just like one from the Notepad.
19. After you get familiar with the properties, it is recommended that you use the quick property - dbQP to make the code less crowded by hiding the insignificant properties. The above 3 property lines can then be simplified to -
    
                Mydb.dbQP = "U=1| D=NWIND| Q=orders"
     

Working with Web Control - Implementing the Impossible! - Magic ASPdbDS

The following illustrates how to male Tornado to work with the VS web controls. We'll pick the most difficult one - Grid Control. On top of that we'll implement an 'Impossible' application. Impossible? or at the least a lot of effort - that is, if you do not use Tornado!

This 'Impossible' grid application is to sort a lookup column. For example, the grid column is an integer field 'employeeid' (0,12,3...). When you sort this column, it'll be shown as 0,1,2,3... Now, if we implement a string lookup of the 'employeeid' as 'firstname + lastname', when the column is sorted, the display will not be appear to be sorted. It'll show whatever the lookup of integer 0,1,2,3 correspond to and not the actual lookup string of 'firstname + lastname'. Try that! And then after you learn the solution, ask your die-hard VS program-friends to try that also and see their hair turns white!

1. Use the above VS procedures to setup a WebForm with Tornado.dll loaded into the reference.
2. Got the Designer page and drag a DataGrid component onto it as DataGrid.
3. Set the properties of the DataGrid  -

• (ID) = DataGrid | CssClass = R1 | Caption=DataGrid Sortng Demo
• AutoGenerateColumn = False | AllowSorting = True | AutoPaging = True | PageSize=5
• Columns (Collection) Create columns automatically at run time = Unchecked
• Columns (Collection) Bound Column - Header Text = Name | DataField = EmployeeID | Sort Expression= Employeeid
• Columns (Collection) Bound Column - Header Text: Born | DataField: BirthDate | Sort Expression=Birthdate
• Columns (Collection) Bound Column - Header Text: Reports To | DataField: ReportsTo | Sort Expression=ReportsTo
• PageStyle - HorizontalAlign = Left
• PageStyle - Mode = NumericPages
• HeaderStyle - CssClass = GH | HorizontalALign = Center
• AternateItemStyle - CssClass = R2

4. Set the Events of DataGrid -

• For C# - Click the Events button at the top of the properties window and point to the events call.
• For Visual Basic - In the left-hand drop-down list at the top of the Code Editor, select DataGrid. Select PageIndexChanged event on the right side. The event Sub will open. Type in - Page_Grid(source,e)
• Repeat and select SortCommand event on the right side. The event Sub will open. Type in - Sort_Grid(source,e)
• Since we know we are going to make this a stand alone application later on, we'll do it a different way instead of the above Code-Behind way. We put the two events directly into the DataGrid property's <asp: DataGrid....> block. Just place them anywhere with space between ->

  OnPageIndexChanged="Page_Grid" OnSortCommand="Sort_Grid"
   

Seems like Microsoft cannot find a way to place the event in the <asp:...> block like the properties automatically and user has to do it manually. After setting up the DataGrid properties and events, we are ready to build up some Tornado Code to work with the DataGrid contorl. The following is the complete set of code. Just cut and paste that into the WebForm.

 

[vb]
<%@ Import Namespace="System.Data" %>
<script language="VB" runat="server">

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
  If Not IsPostBack Then
    Bind()
  End If
End Sub	

Function CreateDataSource() As DataSet
Dim TT As New Tornado.z
  With TT
    .dbQP = "U=99|S=24|Ps=-1|D=Nwind"
    .dbSQL = "Select employeeid, Birthdate, reportsto From employees"
    .dbCommonTables = "index=FullName| sql=Select Firstname & ' ' & Lastname from employees; index=EID|sql=Select Employeeid from employees"
    .dbLookUpFlds = "fi=ReportsTo|key=EID|look=FullName,fi=Employeeid|key=EID|look=FullName"
    .dbMagicCell = "Fi=ReportsTo|Mac=(|IN|||Nobody [Boss])"
    Return .ASPdbDS("fi=employeeid|Ty=string, fi=reportsto|Ty=string")
  End With
End Function

Sub Sort_Grid(ByVal sender As Object, ByVal e As DataGridSortCommandEventArgs)
  Session("SortExp") = e.SortExpression.ToString()
  Bind()
End Sub	

Sub Page_Grid(ByVal Sender As Object, ByVal e As DataGridPageChangedEventArgs)
  DataGrid.CurrentPageIndex = e.NewPageIndex
  Bind()
End Sub	

Sub Bind()
Dim DS As DataSet = CreateDataSource()
Dim DV As DataView = DS.Tables("MyTable").DefaultView
  DV.Sort = Session("SortExp")
  DataGrid.DataSource = DV
  DataGrid.DataBind()
End Sub	

We are not going to do the Code-Behind way as below

Private Sub DataGrid_PageIndexChanged(ByVal source As Object, 
  ByVal e As System.Web.UI.WebControls.DataGridPageChangedEventArgs) Handles DataGrid.PageIndexChanged
  Page_Grid(source, e)
End Sub	

Private Sub DataGrid_SortCommand(ByVal source As Object, 
  ByVal e As System.Web.UI.WebControls.DataGridSortCommandEventArgs) Handles DataGrid.SortCommand
  Sort_Grid(source, e)
End Sub

</Script>	

 

What can 23 lines of Tornado code do? Run the code and find out. You noticed that beside the usual DataGrid color and script, the Employeeid and Reportsto field are replaced by their First-Lastname lookups - Nothing unusual. Now click the linked field name to sort the fields. You'll notice that the sort column is sorted according to the First-Lastname and not by the employeeid integer. Repeat that for the Reportsto field and the same effect.

I'll explain the Tornado code as the rest are standard DataGrid code.dbCommonTables setup the lookup table of Fullanem and EID. MagicCell place the [Boss] in cell where the employee has nobody to report to. Now the trick is the ASPdbDS call that returns the records in sorted order in a dataset format. All Tornado filters (Magic, LookUp etc) are supported. When the RecordSet is transferred from ASP-db to The DataSet, the schema is also transferred. When data is transformed, then the data type needs to be changed. For example, EmployeeID type is is System.Int32. After the MagicCell transform, it becomes the First_Last_Name, the type now is System.String instead. You must specify the new data type. The syntax is -

Dim DSvar as DatSet = Obj.ASPdbDS("field=Employeeid| Type=String).

Now, everything is still in VS and Code behind stuff. How can we make it stand alone?

Go to the WebForm Designer and click on HTML and you'll see all the HTML code of the DataGrid control including the properties set in the property grid.

First place the above code within the <script language="VB" runat="server">......</Script> block and import the System.Data Namespace. Cut the code from <HTML> to </HTML> including the HTML tag and place that after the </Script>. I usually delete the <HEAD> block unless there is something there I need. That's it, run the code and experience the sorting of the lookup values. Sink into it for a bit and try to see what is going on.

<HTML>
  <body MS_POSITIONING="GridLayout">
    <form id="Form1" method="post" runat="server">
    <asp:datagrid id="DataGrid" style="Z-INDEX: 101; LEFT: 48px; POSITION: absolute; TOP: 80px" runat="server"
    Width="400px" CssClass="R1" AutoGenerateColumns="False" AllowPaging="True" PageSize="5" AllowSorting="True"
    Caption="DataGrid Sorting Demo"  OnPageIndexChanged="Page_Grid" OnSortCommand="Sort_Grid" >
    <AlternatingItemStyle CssClass="R2"></AlternatingItemStyle>
    <HeaderStyle HorizontalAlign="Center" CssClass="GH"></HeaderStyle>
    <Columns>
      <asp:BoundColumn DataField="EmployeeID" SortExpression="Employeeid" HeaderText="Name"></asp:BoundColumn>
      <asp:BoundColumn DataField="BirthDate" SortExpression="Birthdate" HeaderText="Born"></asp:BoundColumn>
      <asp:BoundColumn DataField="ReportsTo" SortExpression="ReportsTo" HeaderText="Reports To"></asp:BoundColumn>
    </Columns>
    <PagerStyle HorizontalAlign="Left" Mode="NumericPages"></PagerStyle>
    </asp:datagrid></form>
  </body>
</HTML>	

For your complete reference I also include the identical C# .aspx code below, the HTML section is the same. So VB and C# are both .aspx file and they execute the same in stand alone mode.

[C#]
<%@ Import Namespace = "System.Data" %>
<script language="C#" runat="server">
private void Page_Load(object sender, System.EventArgs e)
{
  if (!IsPostBack) Bind();
}

private DataSet CreateDataSource()
{
  Tornado.z TT = new Tornado.z();
  TT.dbQP = "U=99|S=24|Ps=-1|D=Nwind";
  TT.dbSQL = "Select employeeid, Birthdate, reportsto From employees";
  TT.dbCommonTables = "index=FullName| sql=Select Firstname & ' ' & Lastname from employees; index=EID|sql=Select Employeeid from employees";
  TT.dbLookUpFlds = "fi=ReportsTo|key=EID|look=FullName,fi=Employeeid|key=EID|look=FullName";
  TT.dbMagicCell = "Fi=ReportsTo|Mac=(|IN|||Nobody [Boss])";
  return TT.ASPdbDS("fi=employeeid|Ty=string, fi=reportsto|Ty=string");
}

private void Sort_Grid(object sender, DataGridSortCommandEventArgs e) 
{
  Session["SortExp"] = e.SortExpression.ToString();
  Bind();
}

private void Page_Grid(object Sender,DataGridPageChangedEventArgs e) 
{
  DataGrid.CurrentPageIndex = e.NewPageIndex;
  Bind();
}

private void Bind() 
{
  DataSet DS = CreateDataSource();
  DataView DV = DS.Tables["MyTable"].DefaultView;
  DV.Sort = (string) Session["SortExp"];
  DataGrid.DataSource = DV;
  DataGrid.DataBind();
}
</script>

So, we do not just use the VS Web controls, we take them a mile further then it can go. Tornado is a very powerful filtering engine adn it can take to to places that VS cannot.

 

Mixing JavaScript and Aspx Code

You can make a quick JavaScript function for validation as shown in the following aspx file. Test the application by inputting employeeId > 10. Now, how to do this in Code-Behind? First put the <Script>...</Script> code in the WebForm (WebForm.aspx.vb)as usual. The cut the <Head>...</Head> code in the HTML window of the Designer (WebForm.aspx). Place the code within the <Head> block.

<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function MyJS() {
var id = parseInt(document.forms[0].elements[0].value,10)
if (id > 10 | id < 1 )
{
alert('\nSorry, you can only input employeeID 1-10.\n\n Please try again.');
return false; // go back to the form
} else {
return true; // good answer, proceed
}
}
</SCRIPT>
</HEAD>

<script language="vb" runat="server">
Sub Page_Load(Source as Object, E as EventArgs)
  Dim JS As New Tornado.z
  With JS
    .dbQP = "u=36| D=Nwind| S=8| Gdf=0,1,2,3| Q=Employees| Ni=B5,Filter| Ff=0,1,2,3| Th=ti=Filter Javascript"
    .dbFilterValidateName = "MyJS()"
    .ASPdbNET()
  End With
End Sub
</script>

Designer HTML Page (WebForm.aspx) code containing the validation MyJS().

<%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm2.aspx.vb" Inherits="xapsx.WebForm2"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>WebForm2</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<SCRIPT LANGUAGE="JavaScript">
function MyJS() {
var id = parseInt(document.forms[0].elements[0].value,10)
if (id > 10 | id < 1 )
{
alert('\nSorry, you can only input employeeID 1-10.\n\n Please try again.');
return false; // go back to the form
} else {
return true; // good answer, proceed
}
}
</SCRIPT> 
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
</form>
</body>
</HTML>

Map ASPdb.Net modules into the Table Control

<script language="VB" runat="server">
Sub Page_Load(Src As Object, E As EventArgs)
  Dim z As New Tornado.z
  Dim GD As New Tornado.GetData
  z.dbQP = "U=88| D=NWIND| Q=Orders| GDF=0,1,2,3| S=2| iv=t| Th=ti=Web Control Tornado Demo!sub=Table Control"
  z.ASPdbNET("notitle=true")
  Table1.Rows(0).Cells(0).Text = GD.Get_Title(88)
  Table1.Rows(1).Cells(1).Text = GD.Get_ASPDBNET(88)
End Sub
</script>

 

Advanced JavaScript and Aspx Code

The following example is an advanced mix of ASP-db aspx code and Javascript code. The example performs a validation using the Tornado Validator and also some User Javascript validation code. To start the development in VS. Copy the Blue code to the webform of the project as descripted above. Debug the VB code (C# if preferred). After the application is developed in VS, copy the blue code to an .aspx shell which are the code in Black and make it a stand  aspx file. With a stand alone .aspx file, you do not need VS at all. You only need the .aspx file and Tornado.DLL and of course the DotNet framework installed on the server.

<script language='vb' runat='server'>
Sub Page_Load(Source as Object, E as EventArgs)
   Dim ta As String = "<" & "script language='javascript'>" & vbCrLf
   ta &= "function checkselect(thisform){" & vbCrLf
   ta &= "if (thisform.ASPDB_UPDATE_16_0.options[thisform['ASPDB_UPDATE_16_0'].selectedIndex].value == '')" & vbCrLf
   ta &= "{" & vbCrLf
   ta &= "alert('ReportsTo Field cannot be Blank');" & vbCrLf
   ta &= "return false;" & vbCrLf
   ta &= "}" & vbCrLf
   ta &= "else {return true;}" & vbCrLf
   ta &= "}<" & "/script>" & vbCrLf
   Dim Update As New Tornado.z
   With Update
      .dbUnit = 701
      .dbMode = "ty=dual-horiz| sysind=t"
      .dbSkin = 3
      .dbDSN = "nwind.mdb"
      .dbSQL = "Select * From employees"
      .dbGridDisplayFlds = "0,1"
      .dbValidatorParams = "code=/tornado/Jars|entry=false| UserValidateJs=checkselect(thisform)"
      .dbEditUpdateFlds = "fi=0|ty=RONOUPdate,4,fi=HireDate|ty=TextCalendar, " & _
      "fi=HomePhone|ty=TEXT|mask=USPHONE|event=both|req=true|err=Must be " & _
      "XXX-XXX-XXXX,fi=ReportsTo|ty=SELECTBOX+B|val=EID|tex=FullName,fi=Notes|" & _
      "type=TextArea|tag=COLS=25 ROWS=5"
      .dbNavigationItem = "top,bottom,prev,next,update"
      .dbBookMark = "employees;0"
      .dbFormMagicCell = "fi=HireDate|macro=#Hiredate::d#"
      .dbCommonTables = "index=EID,First,FullName|sql=Select employeeid,Firstname," & _
      "Firstname & ' ' & Lastname from employees"
      .dbLookUpFlds = "fi=EmployeeID|key=EID|look=FullName,fi=ReportsTo| key=EID|look=Fullname"
      .dbTextHolder = "Title=Tornado Demo - Normal Update with Advanced Validation"
      .dbSendHead = ta
      .ASPdbNET()
   End With
End Sub 
</script>

---

Send comments on this topic.
Copyright 1998-2006 ASP-db