Welcome Guest, Not a member yet? Register   Sign In
Jump to 'error' anchor after form validation fails
#1

[eluser]Andrew Gunstone[/eluser]
Hi all,

I've got a very basic/normal form setup, but it happens to be well down the page (i.e. well under the fold). This is no worries, as the user normally reads down the page, then boom... there is my lovely form.

The issue is when they incorrectly complete the form, and I have to show errors. I would like to 'jump' them straight down to the form (displaying the errors as well)... unfortunately the page refreshes, and the user is left back at the top of the page!

Is there a way to load a view but have it jump to an anchor link? I've tried using a redirect() but this clears all the $_POST/form data, so I can't repopulate the fields.

Any thoughts?

Cheers.
#2

[eluser]tonanbarbarian[/eluser]
javascript could scroll down but if they have that disabled it would not obviously work

the best solution I can think of is to display a warning message at the top of the page indicating that the validation failed and include an anchor link there that scrolls down to the form

i usually put an extra message at the top of the page if validation fails just to ensure that the user is aware there is an issue
#3

[eluser]bretticus[/eluser]
If you want to use a very old hack (I'm oldschool) use a named anchor for your form action.
Code:
<a name="theform">My Form</a>
&lt;form action="this/page#theform" .../&gt;
#4

[eluser]Andrew Gunstone[/eluser]
Thanks guys! Both of these are great thoughts. I've implemented a fix... but I love the old school 'hack'... think I might do that instead!

Love it.

Cheers.
#5

[eluser]Nelu[/eluser]
what if someone is using:
Code:
$config['url_suffix'] = ".html"
from the config.php? the
Code:
&lt;form action="this/page#theform" .../&gt;
will go to:
Code:
this/page#theform.html

and the scroll down will not work.
#6

[eluser]bretticus[/eluser]
Any reason why you're not setting your action to reflect the fact that CI will accept the pseudo-extension?

Code:
&lt;form action="this/page.html#theform" .../&gt;
#7

[eluser]Nelu[/eluser]
In fact I'm using
Code:
redirect('some/action');
exit();
inside of a form processing function (in controller) and if I try to point to the bottom of the page using
Code:
redirect('some/action#bottom');
exit();
or
Code:
redirect('some/action.html#bottom');
exit();
the url becomes: some/action.html#bottom.html
#8

[eluser]bretticus[/eluser]
I see, so redirect() it smart enough to automatically add the .html extension.

However, not sure how this factors into your original statement that this messes up the URL somehow. The example you gave shows form HTML with the action set statically? How does that get redirected?




Theme © iAndrew 2016 - Forum software by © MyBB