CIS 451: Tables with ASP

1
CIS 451 Tables with ASP

• Dr. Ralph D. Westfall
• January, 2009

2
HTML Layout with Tables

• lth2gtSimple Table with no cellpadding or
  cellspacinglt/h2gt
• ltTABLE BORDER1 bordercolor"0000FF" gt
• ltTRgt
• ltTHgtdefines header for 1st column 1st
  rowlt/THgt
• ltTHgtdefines header for 2nd column 1st
  rowlt/THgt
• lt/TRgt
• ltTRgt
• ltTDgtdefines 1st column, 2nd rowlt/TDgt
• ltTDgtdefines 2nd column, 2nd rowlt/TDgt
• lt/TRgt
• lt/TABLEgt

3
Table Code

• ltTABLE BORDER0 CELLPADDING"5" CELLSPACING"0"
  WIDTH100 ID"whatever"gt
• ltCAPTION ALIGN"BOTTOM"gt Table Caption at the
  bottom lt/captiongt
• 'If you don't want a visible table BORDER set
  border0
• CELLSPACING amount of space BETWEEN table cells
• CELLPADDING amount of space surrounding data in
  a table cell - keeps words from jamming against
  edge
• CAPTION text that provides information about the
  table

4
Table Layout Table Size

• ltTABLE WIDTH"100" HEIGHT"100"gt
• Table size will adjust to the size of the screen
• ltTABLE WIDTH"468" Height"100"gt
• Table width is set to 468 pixels, which should be
  viewable on any monitor
• including space for scroll bar on right

5
Table Layout Column Size

• ltCENTERgtltTABLE BORDER"0" WIDTH"300" gt
• ltCAPTIONgt ltH3gt Internet Growthlt/H3gt lt/CAPTIONgt
• ltTRgt ltTH WIDTH "50"gtDate lt/THgt
• ltTHgtNumber of Hosts nbsplt/THgt lt/TRgt
• ltTRgt ltTDgt8/81nbsplt/TDgt
• ltTDgt213.0nbsplt/TDgt lt/TRgt
• some rows left out here ...
• lt/TABLEgtlt/CENTERgt

6
Rows Columns that Span

• ltTD COLSPAN"2"gtLa Delt/TDgt
• sets cell to span two columns
• ltTD ROWSPAN"2"gt Dahlt/TDgt
• sets cell to span two rows

7
Aligning Data in Tables

• ltTD ALIGN"LEFT"gtCell content is left
  justifiedlt/TDgt
• ltTD ALIGN"RIGHT"gtCell content is right
  justifiedlt/TDgt
• ltTD ALIGN"CENTER"gtCell content is centeredlt/TDgt
• better to do this with style sheet code

8
Writing Tables with ASP.NET

• create asp.net project
• add a button and click to make sub
• paste code on following pages into sub
• note could also create a big String with all the
  content and write it once instead of line by line

9
Writing Tables with ASP.NET

• write HTML code to start a table
• Response.Write("lttable border1gt")
• Response.Write("lttrgtltthgt" _
• "Product Namelt/thgtltthgt" _
• Product Price lt/thgtlt/trgt")
• 'can be all on one line, without
• 'line continuation concatenate

10
Writing Tables with ASP - 2

• Use a loop to create rows and cells, and put ASP
  data into the cells
• For intIndex 1 to 2
• Response.Write("lttrgtlttdgt" _
• intIndex " " _
• strFood(intIndex) _
• "lt/tdgtlttdgt" _
• dblPrice(intIndex) "lt/tdgtlt/trgt")
• Next

11
Writing Tables with ASP - 3

• Write HTML code to end the table
• Response.Write("lt/tablegt")
• sample code

12
Exercise - table.aspx Code

• test in Visual Studio after each of the following
  changes
• 0 create .aspx file and verify that it runs
• 1 make the border invisible and change the
  alignment of data in 1 column
• 2 add 2 more rows of data, and change the code
  to print them also
• 3 change the table to 3 columns and put intIndex
  in the first column (also add an appropriate
  header)

13
Exercise - 2

• find an HTML reference for tables e.g., tables
• use the information to incorporate more additions
  or changes into your .aspx code for writing
  tables