Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

PHP Build a Basic PHP Website (2018) Adding a Basic Form Checking the Request Method

Matthew Barnes
PLUS
Matthew Barnes
Courses Plus Student 16,550 Points
Posted by Matthew Barnes
Matthew Barnes
Courses Plus Student 16,550 Points

Prevent website going to top of page on form submit

Hi all,

I'm using the "Create a basic PHP Website" course to help me code my contact form on my personal portfolio page. I'm currently on the "Checking the Request Method" video where we delete the process.php and thanks.php files and code it all on to the suggest page.

I have ported this over to my portfolio page, and it's working a treat. However, my portfolio page is a single page website and is relatively long so on form submission, the browser relocates to the top of my page.

I would like to prevent this relocation, so the user can see the thank you message (Which replaces my form at the bottom of my page) straight away, instead of, unrealistically, navigating back to the bottom of my page to see the thank you message.

If this relocation can't be prevented, I'll just show a thank you message at the top, but Ideally, I would like to prevent this relocation or have a way to automatically navigate back to the bottom of the page on form submission.

Thanks In advance!

Matt

2 Answers

Matthew Barnes
PLUS
Matthew Barnes
Courses Plus Student 16,550 Points
Matthew Barnes
Matthew Barnes
Courses Plus Student 16,550 Points

Figured it out:

Change form action attribute from:

<form action="index.php" ......>

To:

<form action="index.php#formID" ......>

formID = any element with an ID you would like to relocate to

maze
maze
17,027 Points
maze
maze
17,027 Points

Hi Matthew! You can do it with JavaScript. Maybe this helps:

https://teamtreehouse.com/library/ajax-basics

Matthew Barnes
Matthew Barnes
Courses Plus Student 16,550 Points
Matthew Barnes
Matthew Barnes
Courses Plus Student 16,550 Points

Thanks maze! Appreciate your time! In the end I was able to achieve this, simply by changing the action attribute of my form to include the id of my form e.g. 

<form action="index.php#formID">...

Thank you for your reply