SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Problem with Contact Page

    Hi,
    I am very new to this and have been working through the Build Your Own Website Book but adapting it for my own website.

    I went to the Freedback Site and used their HTML as directed in the book, but two things have happened.
    1. A text box has gone missing, and another label and text box have moved around
    2. The form does not work. Does it need to be "live" before it works?

    Hope someone has a few minutes to help me with this (I've wasted hours!).

    Here is my HTML - do you need the CSS as well?
    Code HTML4Strict:
    <!DOCTYPE html><html lang="en">
    <head>
    <title>Battle Tax - Professional, Personal, Tax Advice</title>
    <meta charset="utf-8"/>
    <link href="style1.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>
    <div id="header">
    <div id="sitebranding">
     
     
    </div> <!-- end of sitebranding div -->
    <div id="logo">
    <h1> <img src="charles/BattleTaxLogo1.jpg" width="400" height="83"/> </h1>
    </div>
    <div id="tagline">
    <p> </p>
    </div> <!-- end of tagline div -->
    <div id="email">
    <p><a href="mailto:">Email</a></p>
    </div>
    <div id="telephone"> 
    <p>Telephone/P>
    </div> <!--end of telephone div-->
    </div> <!-- end of header div --> 
    <div id="navigation">
    <ul>
    <li><a href="index.html">Home</a></li>
    <li><a href="selfassessment.html">Self Assessment Tax Returns</a></li>
    <li><a href="soletraders.html">Sole Traders and Self Employed</a></li>
    <li><a href="capitalgains.html">Capital Gains Tax</a></li>
    <li><a href="incometax.html">Income Tax</a></li>
    <li><a href="inheritancetax.html">Inheritance Tax</a></li>
    <li><a href="about.html">About Battle Tax</a></li>
    <li><a href="contact.html">Contact Us</a></li>
    </ul> 
    </div> <!-- end of navigation div -->
    <div id="bodycontent"> 
    <h2>Contact Us</h2>
    <p>To arrange an informal consulation or to find out more about our services, please use the form below.</p>
    <form action="" method="post" class="contact">
    <form enctype="multipart/form-data" class="contact" method="post" action="http://www.freedback.com/mail.php" 
     
     
    accept-charset="UTF-8">
    <div>
    <input type="hidden" name="acctid" id="acctid" value="icjucwejbpk84rrh" />
    <input type="hidden" name="formid" id="formid" value="1049912" />
    <input type="hidden" name="required_vars" id="required_vars" value="name,email" />
    </div>
    <fieldset>
    <legend>Contact Us With an Enquiry</legend>
    <div>
    <label for="name" class="fixedwidth">Contact Name</label>
    <input type="text" name="name" id="name" size="40" value="" />
    </div>
    <div>
    <label for="email" class="fixedwidth">Email Address</label>
    <input type="text" name="email" id="email" size="40" value="" />
    </div> 
    <div>
    <label for="telephone" class="fixedwidth">Telephone Number</label>
    <input type="text" name="field-1b523f116fe375b" id="field-1b523f116fe375b" size="40" value="" />
    </div>
    <div>
    <label for="Mobile" class="fixedwidth">Mobile Telephone Number</label>
    <input type="text" name="field-623713f0bdf034a" id="field-623713f0bdf034a" size="40" value="" />
    </div>
    <div>
    <p>Please provide details of your enquiry in the text area below, and we will endevour to respond to 
     
     
    your enquiry within 24hours.</p>
    <label for="field-59ac8195ad7d068" class="fixedwidth">Enquiry Details</label>
    <textarea name="field-59ac8195ad7d068" id="field-59ac8195ad7d068" rows="6" cols="40"></textarea>
    </div>
    <div class="buttonarea">
    <input type="submit" value="Submit Enquiry"/>
    </div>
    </fieldset>
    </form> 
    </form> 
    <p>Alternativly, contact Charles Dunn (CTA) on 
    or <a href="mailto:">email</a>.</p>
    </div> <!-- end of bodycontent div -->
    </body>
    </html>
    Last edited by spikeZ; Feb 26, 2012 at 08:05. Reason: Removed email and phone (security risk)

  2. #2
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    The duplicate ID values for 'email' on that DIV won't help you any regarding focusing on the form or it processing and you don't seem to have an ID for 'Mobile' and 'telephone' looks wrong... Plus for some bizarre reason you have a nested FORM, somewhere you have gone seriously wrong with the copy-and-paste. Plus made bad choices with the DIV and their ID values (duplication of ID is illegal).

    The FIELDSET and LEGEND is usually supposed to come directly after the start FORM tag and not after an erroneous DIV all your form is muddled up. Also double check your other Freedback variable values are correct first so shove it through the W3C Validator and try again...

  3. #3
    <title class="lol"> bronze trophy TehYoyo's Avatar
    Join Date
    Feb 2012
    Location
    Northeast Chicago Suburbs
    Posts
    806
    Mentioned
    18 Post(s)
    Tagged
    1 Thread(s)
    It kills me that you specify the code as HTML4 Strict and then your next piece of text is an HTML5 DTD...

    ~TehYoyo

  4. #4
    Life is not a malfunction gold trophysilver trophybronze trophy
    TechnoBear's Avatar
    Join Date
    Jun 2011
    Location
    Argyll, Scotland
    Posts
    5,340
    Mentioned
    214 Post(s)
    Tagged
    5 Thread(s)
    Quote Originally Posted by TehYoyo View Post
    It kills me that you specify the code as HTML4 Strict and then your next piece of text is an HTML5 DTD...

    ~TehYoyo
    Ah, but if you select the HTML option from the Syntax dropdown menu, it doesn't warn you that it's going to mark it up as HTML4 Strict. Very confusing for a newbie - and the rest of us.

  5. #5
    <title class="lol"> bronze trophy TehYoyo's Avatar
    Join Date
    Feb 2012
    Location
    Northeast Chicago Suburbs
    Posts
    806
    Mentioned
    18 Post(s)
    Tagged
    1 Thread(s)
    Code HTML5:
    Meh.  Some of us find ways around that. :D

    To the OP, be warned that, although Ian Lloyd's book is fantastic and I love it, it won't guarantee a beautiful, fantastic website. There is still much more to design and development.

    ~TehYoyo

  6. #6
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Mike wrapped the CODE block because it's the closest to HTML with syntax highlighting available in the SPF vBulletin drop-down options the OP didn't use any code wrap in the original post.

  7. #7
    SitePoint Zealot behati's Avatar
    Join Date
    Feb 2012
    Location
    Copenhagen, Denmark
    Posts
    152
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Go through your form tags again The best way to learn is to keep at it untill you find the solution! ^^

  8. #8
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you! I need to spend some time looking at this - it seems I have gone very badly wrong!! I will see if I can make amends - if not it may be worth starting the chapter again.
    Thank you for your time

  9. #9
    Life is not a malfunction gold trophysilver trophybronze trophy
    TechnoBear's Avatar
    Join Date
    Jun 2011
    Location
    Argyll, Scotland
    Posts
    5,340
    Mentioned
    214 Post(s)
    Tagged
    5 Thread(s)
    If you run your code through the W3C Validator periodically, it will help you pick up on errors as you go. Some of these may be as simple as typing mistakes, which can be really hard to find on your own. If you need help interpreting the Validator results, post back here and we'll be glad to help.

  10. #10
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    I have worked it out!!

    I haven't got to the validating section bit of the book yet - but I see it is in there and that is a good tip - thank you, I am sure I will need to use it a lot!

    I took on board you advice and made some changes, re-read the chapter to ensure I had understood all the rules etc.

    I then discovered that my CSS was interfering with the form. I don't fully understand why. I have an email and tel number of the business on the web site with some CSS about where they should be positioned etc and these instructions were being applied to the email and tel number bits on my form. So I changed the div class names for the business email and telephone so the rules only applied to them and not my form. This worked and my form works. I has taken me ages but I got there.

    PS - It is great there is a forum for us beginners with helpful and understanding advice. I guess some of you experienced programmers must bang your heads against the computer when you see the muddles we get in! So thanks for being so patient!

  11. #11
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    No, I don't bang my head because we all have to start somewhere and I can vaguely remember in another life how hard it was leaning to create my first web pages, etc.

    Though with a lot of practice it can get like riding a bike so I tend to guide more rather than just giving out copy-and-paste solutions so that it becomes a good learning experience and it sticks better in the memory.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •