84 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+2 more
Oreius says

Here is the php script I normally use for my website. (I know absolutely nothing about php)

<?php if(isset($_POST))
    {
        // change this to match YOUR email address
            $to = "myemail@gmail.com";
        // the subject of the email that you will receive
        $subject = "Message from Website";

        // body of the email
        // *****************
        $message = "Message from your website:\n\n";
        $message .= "From: " . stripslashes($_POST["name"]) . "\n";
        $message .= "Email: " . $_POST["email"] . "\n";
        $message .= "Message: " . stripslashes($_POST["message"]) . "\n\n";
        $message .= "IP Address: " . $_SERVER["REMOTE_ADDR"] . "\n\n";
        $message .= "Sent from: " . $_SERVER["HTTP_HOST"] . "\n\n";
        // *****************
        // end of the body

        // from address of the message
        $from = $_POST["email"];
        $headers = "From: ".$_POST["email"];

        // send mail message
        mail($to,$subject,$message,$headers);
        header( 'Location: thanks.html' ) ;
    }
?>

I have in the past just send the user to a thank you html page but this time I have a one page scrolling site and want to keep the user there.

Now for my question in there any way I can just have the php change a random image from something to something else upon the form being submitted? (like the image is blank and then when they submit the form it changes to something that says “thanks”) Do I need another php script or can this one be added to to do what I want? also is that something that php can do or do I need to add some javascript/jquery?

Thanks so much! - php challenged person

894 posts
  • Has sold $1,000+ on Envato Market
  • Has referred 1+ members
  • Has collected 10+ items on Envato Market
  • Has been part of the Envato Community for over 3 years
+5 more
infuse01 says

You can do that with AJAX or Javascript (jQuery). It would be probably be done within an hour or less but I can’t do that since I’m not an expert with Javascript. I would need longer since I first need to figure out how things are working.

Still hope that I could point you in the right direction.

84 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+2 more
Oreius says

Ok thanks. I still keep the php right? or is it all handled by the javascript?

894 posts
  • Has sold $1,000+ on Envato Market
  • Has referred 1+ members
  • Has collected 10+ items on Envato Market
  • Has been part of the Envato Community for over 3 years
+5 more
infuse01 says

Yeah as far as I can say you still keep the PHP . You only need to catch the click event on the button with Javascript and let the jQuery Magic happen. I’m sure there are some tutorials out for that or maybe some other Community Members who can help you a bit further than me.

84 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+2 more
Oreius says

Ok thanks infuse01 !

6 posts
  • Has been part of the Envato Community for over 3 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 1+ items on Envato Market
+1 more
iDangerous says
You can add email status message by adding a couple of code lines in your php script like here:
<?php if(isset($_POST))
    {
        // change this to match YOUR email address
            $to = "myemail@gmail.com";
        // the subject of the email that you will receive
        $subject = "Message from Website";

        // body of the email
        // *****************
        $message = "Message from your website:\n\n";
        $message .= "From: " . stripslashes($_POST["name"]) . "\n";
        $message .= "Email: " . $_POST["email"] . "\n";
        $message .= "Message: " . stripslashes($_POST["message"]) . "\n\n";
        $message .= "IP Address: " . $_SERVER["REMOTE_ADDR"] . "\n\n";
        $message .= "Sent from: " . $_SERVER["HTTP_HOST"] . "\n\n";
        // *****************
        // end of the body

        // from address of the message
        $from = $_POST["email"];
        $headers = "From: ".$_POST["email"];

        // send mail message
        if (mail($to,$subject,$message,$headers)) {
           echo '<?>Thanks! We've got your message!';
        }
        else {
           echo '<p>Sorry! Error occurred, try again later please!</p>';
        }
        header( 'Location: thanks.html' ) ;
    }
?>

But of course it is better to use Ajax request with JavaScript. If you will tell me your contact form fields i can help!

84 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+2 more
Oreius says
<form method="post" action="./js/send.php">
            <ul>
                <li><input name="name" class="name" id="name" value="" type="text" placeholder="John Doe" /></li>
                <li><input name="email" class="email" id="email" value="" type="text" placeholder="you@fantastic.com" /></li>
                <!--<li><input onfocus="this.value=''" class="company" type="text" id="company" name="company" value="Company" /></li>
                <li><input onfocus="this.value=''" class="address" type="text" id="address1" name="address1" value="Address" /></li>
                <li><input onfocus="this.value=''" class="address2" type="text" id="address2" name="address2" value="Address Line 2" /></li>
                <li><input onfocus="this.value=''" class="phone" type="text" id="phone" name="phone" value="Phone Number" /></li>-->
                <li><textarea name="message" class="message" id="message" rows="30" cols="30" placeholder="What's can we help you with today?"></textarea></li>
                <li><input class="button" value="Send your message" type="submit" /></li>
            </ul>
        </form>

        <span id="stamp"></span>

this is my html.

the span id=stamp has a background image and i want it to change when the form is sent.

6 posts
  • Has been part of the Envato Community for over 3 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 1+ items on Envato Market
+1 more
iDangerous says
Ok, as i understand the company, address and phone fields you don’t use, so i didn’t handle these fields. So here is your new HTML with script:
<script type="text/javascript">
$(function(){
    $("#ajaxForm").submit(function(e){
        e.preventDefault();
        var formName = $("#name").val();
        var formEmail = $("#email").val();
        var formMessage = $("#message").val();
        jQuery.post(
            {
                name : formName,
                email : formEmail,
                message : formMessage
            },
            "path_to_php_script_file.php",
            function(status){
                $("#stamp").fadeOut(600,function(){
                    /* If the message has been successfully sent */
                    if(status=="1") $("#stamp_success").fadeIn(600)    
                    /* If the error has been occurred */
                    else $("#stamp_error").fadeIn(600)
                })
            }
        );
    })
})
</script>
<form method="post" action="./js/send.php" id="ajaxForm">
  <ul>
    <li>
      <input name="name" class="name" id="name" type="text" value="" placeholder="John Doe" />
    </li>
    <li>
      <input name="email" class="email" id="email" type="text" value="" placeholder="you@fantastic.com" />
    </li>
    <li>
      <textarea name="message" class="message" id="message" rows="30" cols="30" placeholder="What's can we help you with today?"></textarea>
    </li>
    <li>
      <input class="button" type="submit" value="Send your message" />
    </li>
  </ul>
</form>
<span id="stamp"></span>
<span id="stamp_success" style="display:none;"></span>
<span id="stamp_error" style="display:none"></span>

Here is new php script:

<?php if(isset($_POST))
    {
        // change this to match YOUR email address
        $to = "myemail@gmail.com";
        // the subject of the email that you will receive
        $subject = "Message from Website";

        // body of the email
        // *****************
        $message = "Message from your website:\n\n";
        $message .= "From: " . stripslashes($_POST["name"]) . "\n";
        $message .= "Email: " . $_POST["email"] . "\n";
        $message .= "Message: " . stripslashes($_POST["message"]) . "\n\n";
        $message .= "IP Address: " . $_SERVER["REMOTE_ADDR"] . "\n\n";
        $message .= "Sent from: " . $_SERVER["HTTP_HOST"] . "\n\n";
        // *****************
        // end of the body

        // from address of the message
        $from = $_POST["email"];
        $headers = "From: ".$_POST["email"];

        // send mail message

        if(mail($to,$subject,$message,$headers)) echo "1";
        else echo "0";

    }
?>

As you can see there are two new spans with “stamp_success” and “stamp_error” id attributes. They are hidden by default and will be shown after the form will be sent. It will have some animation, old span will fade out and new span will fade in. So add the background images for them depending on their purpose.

6 posts
  • Has been part of the Envato Community for over 3 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 1+ items on Envato Market
+1 more
iDangerous says

Forgot to say that this script is for the jQuery library

84 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+2 more
Oreius says

ok awesome idangerous i will pop this in and try it next time I am at work. I will let you know how it goes :)

Thanks

by
by
by
by
by
by