Solved

ASP.net Dynamically adding a table with a solid row color

Posted on 2014-03-30
3
760 Views
Last Modified: 2014-03-30
Hi

I am dynamically adding the table below to an ASP.net web page using the code
further down. I want the rows to have a bottom row with a solid row color and border line that runs right through. I generated the second image in Excel, and this shows
how I want the table to look. How do I adjust the VB.net code to achieve this. Thanks


1
2

  Function oTableReport() As Table
        Try

            Dim rowCnt As Integer
            ' Current row count
            Dim rowCtr As Integer
            ' Total number of cells (columns).
            Dim cellCtr As Integer
            ' Current cell counter.
            Dim cellCnt As Integer
            Dim Table1 As New Table
            rowCnt = 2
            cellCnt = 3
            Table1.BorderWidth = 1
            Table1.BorderColor = Drawing.Color.Black
            Table1.BorderStyle = BorderStyle.Solid
            Table1.GridLines = GridLines.None

            For rowCtr = 1 To rowCnt
                Dim tRow As New TableRow()
                tRow.BackColor = Drawing.Color.Aqua
                For cellCtr = 1 To cellCnt
                    Dim tCell As New TableCell()
                    tCell.Text = "Row " & rowCtr & ", Cell " & cellCtr
                    'tCell.BackColor = Drawing.Color.White
                    tCell.ForeColor = Drawing.Color.Blue
                    ' Add new TableCell object to row.
                    tRow.Cells.Add(tCell)
                Next
                ' Add new row to table.
                Table1.Rows.Add(tRow)
            Next
            Return Table1
        Catch ex As Exception
            MsgBox(ex.Message & " rew33")
        End Try
    End Function
0
Comment
Question by:murbro
3 Comments
 
LVL 35

Expert Comment

by:Miguel Oz
ID: 39965651
Very hard to do it in code behind alone.
Please remove the following code from your sample above:
            Table1.BorderWidth = 1
            Table1.BorderColor = Drawing.Color.Black
            Table1.BorderStyle = BorderStyle.Solid
            Table1.GridLines = GridLines.None

Open in new window

and add the following  CSS rules to your mark-up head section as follows:
<head>
<style>
table,th,td
{
border-bottom:1px solid black;
border-spacing: 0px;
}
</style>
</head>

Open in new window

where:
CSS border-spacing removes cell spacing when the value is 0px.
CSS border-bottom creates the bottom border on every header and cell of your table.
0
 
LVL 26

Accepted Solution

by:
Alan Warren earned 500 total points
ID: 39965766
Hi murbro,
Try something like this:
<%@ Page Language="VB" %>

<!DOCTYPE html>

<script runat="server">
  Function oTableReport() As Table
    oTableReport = Nothing

    Try

      Dim rowCnt As Integer
      ' Current row count
      Dim rowCtr As Integer
      ' Total number of cells (columns).
      Dim cellCtr As Integer
      ' Current cell counter.
      Dim cellCnt As Integer
      Dim Table1 As New Table

      rowCnt = 2
      cellCnt = 3

      Table1.GridLines = GridLines.None

      For rowCtr = 1 To rowCnt
        Dim tRow As New TableRow()

        If rowCtr < rowCnt Then

          For cellCtr = 1 To cellCnt
            Dim tCell As New TableCell()
            tCell.Text = "Row " & rowCtr & ", Cell " & cellCtr

            ' Add new TableCell object to row.
            tRow.Cells.Add(tCell)
          Next

        Else ' it's the last row

          For cellCtr = 1 To cellCnt
            Dim tCell As New TableCell()

            tCell.Text = "Row " & rowCtr & ", Cell " & cellCtr
            tCell.CssClass = "lastrow"  ' <<<== apply lastrow style to cells in the last row

            ' Add new TableCell object to row.
            tRow.Cells.Add(tCell)
          Next

        End If

        ' Add new row to table.
        Table1.Rows.Add(tRow)
      Next
      Return Table1
    Catch ex As Exception
      ' MsgBox(ex.Message & " rew33")
      System.Diagnostics.Debug.WriteLine(ex.Message)
    End Try

  End Function

  Protected Sub Button1_Click(sender As Object, e As EventArgs)
    Me.Controls.Add(oTableReport())
  End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
 <style type="text/css">
    table {
      border: none;
      border-collapse:collapse;
      border-spacing:0;

    }
      table tr {
        border: none;
      }
      table td {
        border: none;
      }

    table td.lastrow {
      border-left:none;
      border-right:none;
      border-top:1px solid black;
      border-bottom:3px double black; /*need about 3px to render double line border*/
      background-color:lightblue;
    }
  </style>

    <title>Q_28400693</title>
</head>
<body>
  <form id="form1" runat="server">
    <div>
      <asp:Literal ID="Literal1" runat="server"></asp:Literal>
      <asp:button ID="Button1" runat="server" text="Create Table" OnClick="Button1_Click" />   
    </div>
  </form>
</body>
</html>

Open in new window

Looks like:
Q_28400693
Respectfully yours,
Alan
0
 

Author Closing Comment

by:murbro
ID: 39965803
Thanks very much Alan
0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

In an ASP.NET application, I faced some technical problems. In this article, I list them out and show the solutions that I found.  I hope it will be useful. Problem: After closing a pop-up window, the parent page should be refreshed automaticall…
It’s quite interesting for me as I worked with Excel using vb.net for some time. Here are some topics which I know want to share with others whom this might help. First of all if you are working with Excel then you need to Download the Following …
Excel styles will make formatting consistent and let you apply and change formatting faster. In this tutorial, you'll learn how to use Excel's built-in styles, how to modify styles, and how to create your own. You'll also learn how to use your custo…
This video shows how to remove a single email address from the Outlook 2010 Auto Suggestion memory. NOTE: For Outlook 2016 and 2013 perform the exact same steps. Open a new email: Click the New email button in Outlook. Start typing the address: …

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now