Welcome to TalkGraphics.com
Page 1 of 2 12 LastLast
Results 1 to 10 of 20

Thread: Contact Form

  1. #1

    Default Contact Form

    OK, so I am reluctant to post this because when I searched the archives there were lots of comments from forum members about this subject being "already discussed multiple times".

    But I can assure you I have looked at them all and still am not getting anywhere.

    I want to create a .php contact form on the Contact page. I don't want flash. My host enables php content. Here is the code that I have been trying:

    <?PHP
    $to = "insert email here";
    $subject = "Results from your Request Info form";
    $headers = "From: Form Mailer";
    $forward = 0;
    $location = "";

    $date = date ("l, F jS, Y");
    $time = date ("h:i A");



    $msg = "Below is the result of your feedback form. It was submitted on $date at $time.\n\n";

    if ($_SERVER['REQUEST_METHOD'] == "POST") {
    foreach ($_POST as $key => $value) {
    $msg .= ucfirst ($key) ." : ". $value . "\n";
    }
    }
    else {
    foreach ($_GET as $key => $value) {
    $msg .= ucfirst ($key) ." : ". $value . "\n";
    }
    }

    mail($to, $subject, $msg, $headers);
    if ($forward == 1) {
    header ("Location:$location");
    }
    else {
    echo "Thank you for submitting our form. We will get back to you as soon as possible.";
    }

    ?>

    If I paste it into a placeholder under 'html code (body) and check 'Re-generate placeholder image automatically' it looks like script in a box.

    I can paste this one and it looks normal:

    <FORM name="form" action="/contactform/contactscript.php" method="post">
    <TABLE cellSpacing="2" cellPadding="2" width="400" border="0">
    <TBODY>
    <TR>
    <TD vAlign="top" align="right" width="200">Your Name: </TD>
    <TD vAlign="top" align="left" width="200"><INPUT maxLength="200" size="25" name="name"> </TD></TR>
    <TR>
    <TD vAlign="top" align="right" width="200">Your Email: </TD>
    <TD vAlign="top" align="left" width="200"><INPUT maxLength="100" size="25" name="email"> </TD></TR>
    <TR>
    <TD vAlign="top" align="right" width="200">Your Comments: </TD>
    <TD vAlign="top" align="left" width="200"><TEXTAREA name="msg" rows="4" cols="25"></TEXTAREA> </TD></TR>
    <TR>
    <TD vAlign="top" width="200"></TD>
    <TD vAlign="top" align="left" width="200"><INPUT type="reset" value="Reset" name="Reset"> <INPUT type="submit" value="Submit" name="Submit"> </TD></TR></TBODY></TABLE></FORM>

    But it doesn't point anywhere.

    in both cases, nothing is in the page <head>.

    I downloaded other free contact form php scripts and pasted them into the placeholder html body and I still get a box with script in it.

    So what am I doing wrong? Please?

    John

  2. #2
    Join Date
    Aug 2010
    Posts
    533

    Default Re: Contact Form

    Hi John, firstly your page needs to have a .php extension you can do this by adding .php to your page name as long as it's not the first page in the list.
    Place the PHP script in the (head).
    Then remove action="/contactform/contactscript.php" from the form code so that the form gets submitted to the same page

  3. #3

    Default Re: Contact Form

    Quote Originally Posted by jamesd View Post
    Hi John, firstly your page needs to have a .php extension you can do this by adding .php to your page name as long as it's not the first page in the list.
    Place the PHP script in the (head).
    Then remove action="/contactform/contactscript.php" from the form code so that the form gets submitted to the same page
    Thanks for the reply James.

    1. You are referring to the Second script in my OP. Is that correct.

    2. If I Right click on the Contact page and choose Web Properties, it says page filename - 'contact'. Do I change that to 'contact.php'?

    John

    EDIT: That didn't work at all. It created a contact form in the upper left hand corner despite my placement and changed the menu button to Contact.php

  4. #4
    Join Date
    Aug 2010
    Posts
    533

    Default Re: Contact Form

    Place the PHP script in the (head)
    I am refering to the first piece of code in your OP. The second piece of code in your OP needs to be in the (body). This why the form was showing in the top left corner.

    and changed the menu button to Contact.php
    Using the menu manager you can remove .php from the menu without it affecting the page name.

  5. #5
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,746

    Default Re: Contact Form

    John, sorry it is so frustrating.

    I try and do these things step-by-step.

    Ignore the FORM and PHP. Can you change the contact filename to contact.php in Web Properties > Page > Page filename?
    When you publish, not export, does the page render in your browser?

    When you add the Placeholder body code for the FORM, apart from it not submitting, does it appear and allow data input and button presses?

    When you add in the PHP code to the Page head code, does all now work?

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  6. #6

    Default Re: Contact Form

    Thanks to both of you for the responses. I have been at this for around 15 hours so far and am getting nowhere.

    The suggestions render a box with code displayed. I decided to forget about the code above and tried this next:

    http://reusableforms.com/d/e1/php-co...ith-validation

    1. I downloaded the form. Unzipped the files and Edited the "handler.php file to reflect the proper email address as they said in the readme.

    2. In their video demo they said to rename and upload the entire folder that is created to the web host Cpanel and test the form by opening formpage.html (which is part of the folder)

    https://youtu.be/jAr4ZtLnmn0

    3. I did that and the form displayed perfectly and worked perfectly (but that was directly from the Cpanel).

    4. What they did not explain is how to get it on a webpage. I searched for hours and there was no clue. I entered the code from "handler.php" into the head of the placeholder checking "Re-Generate placeholder image automatically", and I get a box with code written in it. Preview the "Contact" page in a browser and it is blank. Add a .php extension to the page name and all the code is displayed in the webpage preview. Looked for a forum for ReusableForms and they don't have one.

    5. I don't really want to do this but I can take the Contact menu button and create a link to the "formpage.html" file directly in that folder on the server, but I don't know if that is safe or not. From there a hacker could probably get into the rest of the directory.

    John
    Last edited by craftech; 14 August 2018 at 06:06 PM.

  7. #7
    Join Date
    Aug 2010
    Posts
    533

    Default Re: Contact Form

    Hi John, PHP won't work in Xara's preview it would need to be published to your server.

    I can do up a working script and attach the .xar if you can bear with me for a couple of hours as I won't be at my pc untill later

  8. #8

    Default Re: Contact Form

    I appreciate that James, but are you saying that if I paste the handler.php script into a placeolder's (body) and upload the website, the blank box will have the form in it? Does the size matter of the placeholder? Or will it resize to fit? (Ref: Post #6)

    Thanks,

    John

  9. #9
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: Contact Form

    Perhaps this helps John:

    Last edited by Egg Bramhill; 14 August 2018 at 11:47 PM.
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  10. #10
    Join Date
    Aug 2010
    Posts
    533

    Default Re: Contact Form

    Thank you Egg for doing the video!

    @John - if you want to place the form directly onto the page without the Iframe, follow Eggs steps up to the Iframe part, then instead of doing the Iframe create a rectangle the size and position you want the form to be and paste this code in Web Properties -> Placeholder -> HTML code (body)

    Code:
    <div class="row">                <div class="col-md-6 col-md-offset-3" id="form_container">
                        <h2>Contact Us</h2> 
                        <p> Please send your message below. We will get back to you at the earliest! </p>
                        <form role="form" method="post" id="reused_form">
                            <div class="row">
                                <div class="col-sm-12 form-group">
                                    <label for="message"> Message:</label>
                                    <textarea class="form-control" type="textarea" name="message" id="message" maxlength="6000" rows="7"></textarea>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6 form-group">
                                    <label for="name"> Your Name:</label>
                                    <input type="text" class="form-control" id="name" name="name" required>
                                </div>
                                <div class="col-sm-6 form-group">
                                    <label for="email"> Email:</label>
                                    <input type="email" class="form-control" id="email" name="email" required>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12 form-group">
                                    <button type="submit" class="btn btn-lg btn-default pull-right" >Send &rarr;</button>
                                </div>
                            </div>
                        </form>
                        <div id="success_message" style="width:100%; height:100%; display:none; "> <h3>Posted your message successfully!</h3> </div>
                        <div id="error_message" style="width:100%; height:100%; display:none; "> <h3>Error</h3> Sorry there was an error sending your form. </div>
                    </div>
                </div>
    Then paste this code in Web Properties -> Placeholder -> HTML code (head)

    Code:
    <!-- Latest compiled and minified CSS -->        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
            <!-- Optional theme -->
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" >
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    
    
    <script>
    $(function()
    {
        function after_form_submitted(data) 
        {
            if(data.result == 'success')
            {
                $('form#reused_form').hide();
                $('#success_message').show();
                $('#error_message').hide();
            }
            else
            {
                $('#error_message').append('<ul></ul>');
    
    
                jQuery.each(data.errors,function(key,val)
                {
                    $('#error_message ul').append('<li>'+key+':'+val+'</li>');
                });
                $('#success_message').hide();
                $('#error_message').show();
    
    
                //reverse the response on the button
                $('button[type="button"]', $form).each(function()
                {
                    $btn = $(this);
                    label = $btn.prop('orig_label');
                    if(label)
                    {
                        $btn.prop('type','submit' ); 
                        $btn.text(label);
                        $btn.prop('orig_label','');
                    }
                });
                
            }//else
        }
    
    
    	$('#reused_form').submit(function(e)
          {
            e.preventDefault();
    
    
            $form = $(this);
            //show some response on the button
            $('button[type="submit"]', $form).each(function()
            {
                $btn = $(this);
                $btn.prop('type','button' ); 
                $btn.prop('orig_label',$btn.text());
                $btn.text('Sending ...');
            });
            
    
    
                        $.ajax({
                    type: "POST",
                    url: 'handler.php',
                    data: $form.serialize(),
                    success: after_form_submitted,
                    dataType: 'json' 
                });        
            
          });	
    });
    </script>
    contact-form.xar


 

 

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
  •