contact form

Will · February 24th, 2009, 10:07 AM

I have used your method detailed in your book to set up a working contact form for my website (thank you) but I have 2 questions regarding how you have done this.

Firstly If someone enters a long message in the Message box then it still all displays on one line is there a way to get around this and format it slightly better in the text file?

Secondly you have used a table to layout the form I assume this is only because it was outside the scope of this section to explain the CSS for it. Anyway I am trying to lay my form out using CSS and I have run into a few problems.

You can see the contact page here. It was all inline and nice until I added Validation controls. These seem to have thrown it out of alignment and I am wondering how to target them in CSS to get them to display alongside the textboxes on the right so the form goes back to displaying as normal.

It currently doesn't display a confirmation of when a message has been sent and I have set it up to send to an email address that I don't use so don't be worried about sending a useless message to me if you end up having a look at it for me.

Help would be very appreciated Thanks.

Imar · February 24th, 2009, 11:44 AM

Hi Will,

The e-mail you're sending is in HTML format (if you're following along with the book). This means you need to convert regular line breaks to break tags before you assign the body:

body = txtBody.Text.Replace("\r\n", " \r\n")

This converts normal line breaks (\r\n) in HTML breaks.

With regards to your other question: what happens if you don't set the float of the error message to right, but to none instead? I tried that using the IE Dev Toolbar and it caused the asterisks to float to the immediate right of the input controls.

You can see a table-less implementation of a similar contact form I just did here: http://www.dotnetattributes.com/Contact/

Hope this helps,

Imar

Will · February 24th, 2009, 12:50 PM

When I take the float: right; out it goes all out of alignment in firefox completley which is why I put it in there. I am studying your Contact me form now to see if I can fix it using that.

But still stuck so if you can speculate any further on possible problems it is much appreciated.

Imar · February 24th, 2009, 01:01 PM

Instead of taking it out, did you try setting it none? That's what I did and what seemed to work.

Let me know if that helps; if it doesn't, I'll take another look. In that case, can you send me the plain HTML and CSS files through my profile?

Imar

Will · February 24th, 2009, 01:20 PM

Thank you again that worked perfectly.

What does \r\n represent as I see that instead of just replacing \r\n with you are replacing it \r\n if I understood the code correctly?

Imar · February 24th, 2009, 01:39 PM

\r\n represents a carriage return and a line break combination. Replacing it for \r\n is actually a force of habit to keep the source readable.

Consider this text:

The quick brown fox
jumps over the lazy dog.

There's a \r\n between fox and jumps. If you simply replace it with you end up with:

The quick brown fox jumps over the lazy dog.

For HTML capable viewers, this doesn't really matter. They still display it as

The quick brown fox
jumps over the lazy dog.

But if you need to debug the HTML and look in the source, it's easier to understand if you see this:

The quick brown fox 
jumps over the lazy dog.

It just helps me to better understand the final result, but it has no influence on that final result.

Cheers,

Imar

Will · February 24th, 2009, 01:42 PM

Thank you again.