Print Reseller Scheme
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

A quick Contact Form question

Discussion in 'Website Design Forum:' started by bamme, Oct 19, 2009.

  1. bamme

    bamme Senior Member

    Hi people

    Im building a site at the moment with a very simple php contact form involved..

    I have validation sorted using jquery, and am really just looking for a good form template/reference of where to get a form that does the following:

    * Sends a confirmation email to the form user
    * Sends me their message through the form
    * Does NOT validate or spit out any error notifications
    * Does NOT redirect the user to a new page

    Regarding the last point, id simply like a form which, on submitting, either allows a bit of the css in the document to change and show a hidden div saying thankyou for sending or similar, or simply does NOTHING except send the confirmation email and the users message to me, so i can attach a bit of jquery behaviour to the submit button when its clicked.

    Im not too experienced in this sort of thing, please any suggestions??
     
  2. tbwcf

    tbwcf Active Member

  3. bamme

    bamme Senior Member

    thanks for that link :) i really dont need any front end styling at all and itd probably mess things up if i changed the code ive written the form in, i just need the .php bit at the back that does the work!


    I dont think anything within those forms does anything but looks pretty, please correct me if im wrong but i downloaded a template and it doesnt seem to have any sort of 'script or code' that sends the form anywhere, let alone a thankyou message or anything like that..
     
  4. tbwcf

    tbwcf Active Member

    Hi Emma, it sounds like your downloading the html code for the form (used to link to your own php/db).

    What you need is to use the embed code... within wufoo click on "forms" / then "code" on the form you want in the side tab, click "embed form code" then copy and paste the javascript into your webpage and it will pull the functioning form in...

    You can set it to email to yourself by going back to the form manager and setting the "notifications". (it also always writes back to your wufoo db as default - which can be handy).

    When creating/editing a form if you goto "form settings" you can set either your success message or to forward to a html page.

    It's not always the best solution for the job but it does take a lot of the pain out of online forms you can create them in minutes.
     
  5. Sunburn

    Sunburn Active Member

    PHP:
    <?php
    $to
    ="email@domain.co.uk";

    $err="";
    if (
    $_POST) {
        if(
    $_POST["antispamcheck"]!="") {
            exit;
        }

    if (
    $_POST['name'] && $_POST['email'] && $_POST['telephone'] )
         {
         
    $msg="FROM: " $_POST['name'] . "\nEmail Address: " $_POST['email'] . "\nPhone No: " $_POST['telephone'];
            
    mail($to,"Website Enquiry","\n".$msg,"From: web@domain.co.uk");
            
    $showthanks=1;
            }
        else {
            
    $err="Please complete all fields";
            }
        }
    ?>

    HTML:
    <form id="contact-form"  method="post" action="?contact" >
        <fieldset>
                	<legend>Type in your details below and click send.</legend>
    
                    <label for="name">Name: <span class="required" title="Required Feild">*</span></label>
    
                    <input name="name" value="<?php echo $_POST['name']?>" id="name" type="text" title="Please enter your name" />
                    
                    <label for="email">Email: <span class="required" title="Required Feild">*</span></label>
                    <input id="email" name="email" value="<?php echo $_POST['emailAddress']?>" type="text" title="Enter your email address" />
                    
                    <label for="telephone">Telephone:</label>
                    <input id="telephone" name="telephone" value="<?php echo $_POST['telephoneNo']?>" type="text" title="Enter is your telephone no." />
                   
                <input id="antispamcheck" name="antispamcheck" type="text" value="" />
           	      <button  id="submit" type="submit" value="submit">Submit</button>
                    
                    <span>Please note fields with an (<span class="required">*</span>) are required.</span>
                </fieldset>
               <?
    		   echo $err;	
    				?>
            </form>
    
    

    Ok here is an edit version of a contact form I created, it should be fine to work, just what you change or add in html you must also change and add in the php.

    if you need any explanation shout.
     
  6. bamme

    bamme Senior Member

    Wow, thankyou for both detailed responses, this forum is great :)

    To tbwcf: Thanks - i did try wufoo out, and yes the effect i want is exactly as what happens after clicking submit here:

    Untitled Form

    the user is sent a confirmation email, and the form owner gets sent their message, as well as the user not being directed to a new page, and just a bit of text saying thanks replaces the form (ideally though the bit of text would appear elsewhere in the page and wouldn't interfere with the forms presence on the page)

    But the form is already styled and has that button leading to wufoos site and their header.. and the small amount of javascript in the embed code gives no clue about how you could edit that. My form has already been styled and i do not want to change this, nor do i want wufoos branding on the site - i did see a option to download the css file, not sure how or where id upload it again in order for it to take effect though, and theres also the factor that my form is styled using a jquery plugin..

    is this work roundable or is wufoo not right for what i need?

    do you know of a place i could find a very very simply styled form that will do what i need? it seems that php might not cut it and i need ajax/something else (Scary!)

    However at the same time i have had an idea to find a php form that does NOTHING on submit, and try to add a little bit of jquery that will make a div appear saying "thankyou" or "message sent" or similar, when the user clicks that submit button.. will this work??

    To Sunburn: Thanks very much i have pm'ed you about this
     
  7. tbwcf

    tbwcf Active Member

    you could use jquery to do that pretty easy if you had a form that just cleared on submit, you'd just put a function on click of the id of the button...

    Wufoo branding shouldn't appear when you import the form to your page (you can edit what appears etc in the theme editor) & branding won't appear on the notification emails if you set them to html only...

    I used the free version of the form in my own site here... The den of graphic designer & web developer Andy Kleeman

    One benefit of wufoo is it will also reduce spam as its pulled in by js spambots would generally have js disabled and therefore not see the form.

    Sounds like wufoo might not be ideal for you in this case but worth bookmarking for future - very handy for low budget sites or where you need to write back to a db.

    If you need anymore help just give me a shout!
     
  8. Love the fact you call it your Den :lol:
     
  9. tbwcf

    tbwcf Active Member

    Oh yes! :D

    I also have an area of the flat my gf has named "The Pit" - the only area of the flat that is truely mine. :D
     
  10. LOL thats a very common thing.. LOL My dad used to have the garage called the pit :lol:
     
  11. darren

    darren Member

    Never build a script that POST's data to a server and has only client side validation. Always implement server side too/solo.

    Whats to stop me viewing the source of your contact page and then creating a webpage and a form with no validation (no javascript/jquery) and posting to your script all day long?

    Not to mention .. people with javascript disabled.


    This is quite a poor way to deal with spam as it assumes that a bot will fill in your contact form and make sure it has something in every field. If a bot can figure out that it needs an email in an email field even if its called something else, it can pretty much figure out that this field needs to be blank. Not to mention that I could copy your page, remove this field and post all day long, manually.

    Use a random value set in session/page load and parsed as MD5 that is different every time and also placed in a hidden field of the form, then cross-check this in the script when the POST'd data is recieved before sending the mail. Makes it a lot harder to fake.

    And 100% always check the referrer (although, yes it can be spoofed) i.e. if POST data came from http://www.mydomain.com/contact.html then proceed, else dont.

    There are much more techniques but you get the idea. Take contact forms seriously as many of spam emails you/everyone recieve(s) is due to poor validation on contact forms and hijacking.
     
  12. Sunburn

    Sunburn Active Member

    Cheers Darren, I'm not a back end developer by any means the above is perhaps the limit of my skill set in this area, so thanks for the input
     
  13. bamme

    bamme Senior Member

    thanks for your reply tbwcf, interesting to know that and difficult to get my head around.. how do i go about making a wufoo form with my own styling??

    Emma
     
  14. tbwcf

    tbwcf Active Member

    Hi Emma, you can style the form to an extent using the theme designer in wufoo. To go further than that you have to link to a css stylesheet uploaded to your server (in the advanced tab in the theme designer).

    The form will read its own styles after those in the head of your webpage so they would be overwritten by it which is why your css has to be attached in the theme designer, that way it is read after wufoo's own styles.

    You can add classes to your fields in the form editor, that way you can target particular fields pretty easily.

    It does get a bit fiddly to be honest if you want to do a lot to it.

    If you have the web developer toolbar installed the best way to go about it is to preview the from from wufoo then edit the css on that page live (you can also use firebug to check what id's and classes are used in the form) once you have it right by editing the css live copy those styles to your stylesheet you've uploaded and linked....

    Sounds very confusing I'm sure but its not too bad once you get used to it.
     
  15. bamme

    bamme Senior Member

    thanks.. i think ill try wufoo next time i make a form from scratch :)
    thankyou also Darren for the advice, shame it went straight over my head!

    Emma
     
  16. darren

    darren Member

    Hi Emma,

    Basically, what I meant was NEVER do your quote above. Always have validation in your email script (be it PHP. ASP whatever) because people can see what is happening behind the scenes and abuse your script. If I visited your website and was looking I could recognise this with some testing and post emails all day long with no validation in place, bypassing your jquery validation.


    If you really want to do this - bear in mind "or simply does NOTHING except send the confirmation email and the users message to me" is not the best idea from a usability point of view, slap on wrist sort of stuff, since you should visually indicate that something is happening to the user (form submission) and also respond to them with details of the transaction. Check this out;

    http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

    as for the div changing via javascript thats very easy too, the best way is to use a show/hide method;

    show/hide content via <DIV> & Javascript...

    or possibly change the div class.

    Darren
     
  17. bamme

    bamme Senior Member

    Hi Sunburn,
    i tried out your contact form from the code in your post and i dont think ive done it right:

    Untitled Document

    Untitled Document

    Can you point out where im going wrong?? sorry.. ill really stop bothering you after that
     
  18. darren

    darren Member

    The top file is being parsed as HTML. Rename it to .php (seems you done this with the second?) instead of .html.

    Whats the problem with the second file and submission, it seemed to send fine for me?

    With Sunburn's code, leave the very last text box blank. It has to be that way and is a counter measure for bots.
     
  19. bamme

    bamme Senior Member

    Thanks Darren, and I would not have known to leave the last textbox blank - can I not remove this? It kind of gets in the way.. a lot.. and if I didnt know not to use it, im sure not many others will esp. those with no internet knowledge/coding knowledge!
     
  20. darren

    darren Member

    Remove this code;

    And you should be fine.

    Although you would do better to look into implementing a proper contact form later on!
     

Share This Page