0

I have an html / php page with a Require statement which includes another page which includes a form. On completion of the form I use an Echo statement to display the result of the form submission to the user. That all works but I want the page to position itself at the bottom so that the user can see the message.

I've tried specifying a location (bottomOfPage) and using it in the header command, but I can't get it to work.

Can you help me out?

Mohammad, I tried incorporating your solution as follows, but it still does not scroll to botttom:

QUICK FORM 




<?php

if(isset($_GET['send'])) //check the submit button was pressed

//get variables from POST array. Remember we specified POST method

    $fn = $_GET['firstname'];
    $ln = $_GET['lastname'];
    $em = $_GET['emailadd'];
    $pn = $_GET['phonenum'];

    $message = $fn . "\r\n" . $ln . "\r\n";
    $message .= $em . "\r\n" . $pn;

    $to = "trevor.reeves@webthemes.com.au";
    $subject = "webThemes Contact";

    //set up headers
    $headers = 'From: trevor.reeves@webthemes.com.au' . "\r\n" .
        'Reply-To: trevor.reeves@webthemes.com.au' . "\r\n" .
        'X-Mailer: PHP/' . phpversion ();

    //send the email and save the result
    $result = mail ( $to, $subject, $message, $headers );

    //was it sent?
    if ($result) {
        echo "<p>Thank you for sending the message</p>";
        echo "<script>\n";
        $str = "window scrollTo ( 0, document . body . scrollHeight );";
        echo $str;
        echo "\n</script>";

    } else {
        echo "<p>Sorry. An error has occurred. Please email trevor.reeves@webthemes.com.au</p>";
    }

That's not the problem as the PHP script does send an email and display a message. The issue is that the scroll doesn't work:

echo "<script>\n";
$str = "window scrollTo ( 0, document . body . scrollHeight );";
echo $str;
Trevor
  • 169
  • 10

1 Answers1

-1

Here is a nice animated one

<html>
<head>
    <style>
    .form-submitted{
        display:none;
        font-weight:bold;
    }

    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>


<form action="" method="post">
    <lable for="name">Your Name</lable>
    <input type="text" name="name" id="name">
    <input type="submit">
</form>


<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<p>some content<p>
<div class="form-submitted">
    <?php if(isset($_POST['name'])):?>
    <script>
    var success = $(".form-submitted");
        success.show();
        $('html,body').animate({
                      scrollTop: $(success).offset().top -150
                    }, 500);
    </script>
    <?php
        if(isset($_POST['name'])){
            echo "Your name is ".$_POST['name'];
        }
    ?>
    <?php endif;?>
</div>

Jake
  • 47
  • 4