Chapter 9: FormTable

RoseVanKeuren · March 11th, 2009, 03:59 PM

on the Try It Out on page 314, I tried to do step 4 - adding the runat="server" and id="FormTable" tags to the table in ContactForm.aspx .

<tableclass="style1"runat="server" id="FormTable">

*) When I go to the code behind page, it does not recognize FormTable - telling me that it does not exist in the current context.

*) It also has an issue with the runat="server" tag. Here are the compile errors associated with it:

Code:

Error 1 c:\BegASPNET\Site\Controls\ContactForm.ascx(26): error CS1502: 
The best overloaded method match for
System.Web.UI.HtmlControls.HtmlTableRowCollection.Add
(System.Web.UI.HtmlControls.HtmlTableRow)' has some invalid arguments  
 
Error 2 The best overloaded method match for 
'System.Web.UI.HtmlControls.HtmlTableRowCollection.Add
(System.Web.UI.HtmlControls.HtmlTableRow)' has some invalid arguments 
C:\BegASPNET\Site\Controls\ContactForm.ascx 26 
 
Error 3 Argument '1': cannot convert from 'System.Web.UI.WebControls.Label' 
to 'System.Web.UI.HtmlControls.HtmlTableRow' 
C:\BegASPNET\Site\Controls\ContactForm.ascx 26

Imar · March 11th, 2009, 04:09 PM

Hi there,

The table looks fine (other than the messed up pasted syntax here (Jim: any news on this? ;-) ) ), so it must be something else.. A few things:

1. Is this .aspx or .ascx? The table is placed in the User Control, not the Page.

2. Can you post the code for the code behind?

3. Can you add line breaks to the code you posted here? The page is now very wide making it hard to read and reply to.

Cheers,

Imar

RoseVanKeuren · March 11th, 2009, 06:09 PM

Thanks.

The table is in the ascx, not the ascx.cs.

Here's the ascx.cs:

Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Net.Mail;

public partial class Controls_Contactform : System.Web.UI.UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)
    {
      if (txtPhoneHome.Text != string.Empty || txtPhoneBusiness.Text != string.Empty)
      {
        args.IsValid = true;
      }
      else
      {
        args.IsValid = false;
      }

    }
    protected void btnSend_Click(object sender, EventArgs e)
    {
      if (Page.IsValid)
      {
        string fileName = Server.MapPath("~/App_Data/ContactForm.txt");
        string mailBody = System.IO.File.ReadAllText(fileName);

        mailBody = mailBody.Replace("##Name##", txtName.Text);
        mailBody = mailBody.Replace("##Email##", txtEmailAddress.Text);
        mailBody = mailBody.Replace("##HomePhone##", txtPhoneHome.Text);
        mailBody = mailBody.Replace("##BusinessPhone##", txtPhoneBusiness.Text);
        mailBody = mailBody.Replace("##Comments##", txtComments.Text);

        MailMessage myMessage = new MailMessage(); 
        myMessage.Subject = "Response from web site";
        myMessage.Body = mailBody;

        myMessage.From = new MailAddress("[email protected]", "me");
        myMessage.To.Add(new MailAddress("[email protected]", "me"));

        SmtpClient mySmtpClient = new SmtpClient();
        mySmtpClient.Send(myMessage);

        lblMessage.Visible = true;
  /*     FormTable.Visible = false;*/
        System.Threading.Thread.Sleep(5000);
       
      }
    }
}

Here's the beginning of the ascx page:

Code:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ContactForm.ascx.cs" Inherits="Controls_Contactform" %>
<style type="text/css">
  .style1
  {
    width: 100%;
  }
</style>
<script type="text/javascript">
function ValidatePhoneNumbers(source, args)
{
var txtPhoneHome = document.getElementById('<%= txtPhoneHome.ClientID %>');
var txtPhonebusiness = document.getElementById('<%= txtPhoneBusiness.ClientID %>');
if (txtPhoneHome.value != '' || txtPhonebusiness.value != '')
{
args.IsValid = true;
}
else
{
args.IsValid = false;
}
}
</script>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
 
<table class="style1" id="FormTable" >
  <tr>
    <td colspan="3">
      Use the form below to get in touch with us.&nbsp; enter your name, email address 
      and your home or cell phone number to get in touch with us.</td>
  </tr>

Imar · March 11th, 2009, 06:27 PM

Can you try posting the code again and thenremove all formatting using the Toolbar button on the left before you wrap it in code tags?

This (pretty annoying) bug makes it hard to copy and paste your code as all spaces have been removed.

I asked about the location of the table as you mentioned "to the table in ContactForm.aspx" in an earlier post. Tjos seemed to imply an ASP.NET page, not a user control.

Cheers

Imar

RoseVanKeuren · March 12th, 2009, 04:59 PM

Thanks - hopefully it's a little easier to read now.

Fair enough about the aspx vs ascx distinction. Oops.

Imar · March 13th, 2009, 04:36 PM

Are you sure this is the right code? It doesn't have the runat="server" attribute on the table...

As soon as I added it, the error went away.

Hope this helps,

Imar

RoseVanKeuren · March 13th, 2009, 04:47 PM

I had compile errors when I tried using the runat statement - see my original post.

Imar · March 13th, 2009, 04:52 PM

That's why I asked whether this was the right code or not. I copied and pasted your code in a new User Control and didn't have that error. I did have a few others but those were related to some of the TextBox controls you didn't supply.

Mabe you can just post the full User Control code and not half of it to avoid all confusion?

Cheers,

Imar

RoseVanKeuren · March 13th, 2009, 04:58 PM

Here's the full ascx:

Code:

<%@ControlLanguage="C#"AutoEventWireup="true"CodeFile="ContactForm.ascx.cs"Inherits="Controls_Contactform" %>
<styletype="text/css">
.style1
{
width: 100%;
}
</style>
<scripttype="text/javascript">
function ValidatePhoneNumbers(source, args)
{
var txtPhoneHome = document.getElementById('<%= txtPhoneHome.ClientID %>');
var txtPhonebusiness = document.getElementById('<%= txtPhoneBusiness.ClientID %>');
if (txtPhoneHome.value != '' || txtPhonebusiness.value != '')
{
args.IsValid = true;
}
else
{
args.IsValid = false;
}
}
</script>
<asp:UpdatePanelID="UpdatePanel1"runat="server">
<ContentTemplate>
<tableclass="style1"runat="server"id="FormTable">
<tr>
<tdcolspan="3">
Use the form below to get in touch with us.&nbsp; enter your name, email address 
and your home or cell phone number to get in touch with us.</td>
</tr>
<tr>
<td>
Your name:</td>
<tdstyle="margin-left: 40px">
<asp:TextBoxID="txtName"runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidatorID="RequiredFieldValidator1"runat="server"ControlToValidate="txtName"ErrorMessage="Please enter your name.">oops</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
Your email address:</td>
<tdstyle="margin-left: 120px">
<asp:TextBoxID="txtEmailAddress"runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidatorID="RequiredFieldValidator2"runat="server"ControlToValidate="txtEmailAddress"Display="Dynamic"ErrorMessage="Please enter an email address">oops</asp:RequiredFieldValidator>
<asp:RegularExpressionValidatorID="RegularExpressionValidator1"runat="server"ControlToValidate="txtEmailAddress"Display="Dynamic"ErrorMessage="Please enter a valid email address"ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">oops</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td>
Your email address again:</td>
<td>
<asp:TextBoxID="txtEmailAddressConfirm"runat="server"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidatorID="RequiredFieldValidator3"runat="server"ControlToValidate="txtEmailAddressConfirm"Display="Dynamic"ErrorMessage="Please confirm the email address">oops</asp:RequiredFieldValidator>
<asp:CompareValidatorID="CompareValidator1"runat="server"ControlToCompare="txtEmailAddress"ControlToValidate="txtEmailAddressConfirm"Display="Dynamic"ErrorMessage="Please retype the email address">oops</asp:CompareValidator>
</td>
</tr>
<tr>
<td>
Home phone number:</td>
<td>
<asp:TextBoxID="txtPhoneHome"runat="server"></asp:TextBox>
</td>
<td>
<asp:CustomValidatorID="CustomValidator1"runat="server"ClientValidationFunction="ValidatePhoneNumbers"Display="Dynamic"ErrorMessage="Please enter your home or business phone number"onservervalidate="CustomValidator1_ServerValidate">oops</asp:CustomValidator>
</td>
</tr>
<tr>
<td>
Business phone number:</td>
<td>
<asp:TextBoxID="txtPhoneBusiness"runat="server"></asp:TextBox>
</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td>
Comments:</td>
<td>
<asp:TextBoxID="txtComments"runat="server"TextMode="MultiLine"></asp:TextBox>
</td>
<td>
<asp:RequiredFieldValidatorID="RequiredFieldValidator4"runat="server"ControlToValidate="txtComments"Display="Dynamic"ErrorMessage="Please enter a comment">oops</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>
&nbsp;</td>
<td>
<asp:ButtonID="btnSend"runat="server"Text="Send"onclick="btnSend_Click"/>
</td>
<td>
&nbsp;</td>
</tr>
<tr>
<tdcolspan="3">
<asp:ValidationSummaryID="ValidationSummary1"runat="server"/>
</td>
</tr>
<asp:LabelID="lblMessage"runat="server"Text="Message Sent"Visible="false"></asp:Label>
</table>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgressID="UpdateProgress1"runat="server"AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<divclass="PleaseWait">
Please Wait...
</div>
</ProgressTemplate>
</asp:UpdateProgress>

Imar · March 13th, 2009, 07:16 PM

Ah, there it is. Take a look at this:

Code:

 
<asp:ValidationSummaryID="ValidationSummary1"runat="server"/>
</td>
</tr>
<asp:LabelID="lblMessage"runat="server"Text="Message Sent"Visible="false"></asp:Label>
</table>

You are adding the Label directly to the <table> element. This is not allowed; not in HTML, but certainly not in ASP.NET markup. HTML is quite forgiving (or actually the browser is), so it does it's best trying to display the label nonetheless when you have code like this in your HTML.
However, as soon as you add Runat="Server" to the control some interesting stuff happens. When a page is first compiled, the markup you write is parsed and turned into code statements that can be processed at run-time. Something like this will happen:

FormTable.Rows.Add(new Label() {Id="lblMessage"......});

That is, the code tries to insert a Label where it expects an HtmlTableRow. Simply wrapping the label in its own cell and row should fix the problem, as does moving the label outside the table. Fix it to read this:

Code:

 
<tr>
  <td colspan="3">
    <asp:LabelID="lblMessage"runat="server"Text="Message 
                  Sent"Visible="false"></asp:Label>
  </td>
</tr>

or this:

Code:

 
</table>
<asp:LabelID="lblMessage"runat="server"Text="Message 
        Sent"Visible="false"></asp:Label>

Hope this helps,

Imar