VTK Focus on Error

[Martin]

Greetings again!

I was wondering, with the Validation Tool Kit, when there is a missing validation, normally when a form is submitted the page refreshes and goes back up to the top of the page.

So if the form is half way down the page the user then has to scroll back down to that section to then deal with the validation error(s). Is there some way to use the validation toolkit to (when submitted) go to the field with the error, and if their are multiple fields with errors have it focus on the first one?

I appreciate any help!

Cheers,

Martin

[Ray Borduin]

You could probably add an anchor link to the validation toolkit url and then add anchors in the error messages.

[Martin]

Hi Ray,

Thanks for getting back to me so quickly! I have added an inline anchor beside the field I want the page to scroll back to.

I have then gone into the code

<input name="studentName" type="text"
id="studentName" value="<?php echo(ValidatedField("contact","studentName")) ?>" <?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "1" . ",") !== false || "1" == "")) {
if (!(false)) {
?> class="fail"
<?php //WAFV_Conditional contact.php#sName contact(1:)
}
}
}?>/>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "1" . ",") !== false || "1" == "")) {
if (!(false)) {
?>
<div class="red" style="text-align:left;">*Student Name is Required</div>
<?php //WAFV_Conditional contact.php#sName contact(1:)
}
}
}?>

and I have changed the WAFV_Conditional contact.php to contact.php#sName

I tried this in a browser and the #sName was not appended to the URL...

Any ideas?

Thanks again!

Martin

[Ray Borduin]

It looks like a bug in php that the anchors won't carry through properly. I have found a work around for you.

To fix this issue on your site, open the page: WAVT_Scripts_PHP.php

and replace the existing function with the same name with:

function PostResult($thePage, $theErrors, $valPage) {
$thePostURL = "";
SaveFormToSession($theErrors, $valPage);
$thePostURL .= $thePage;
$urlParams = "";
$anchor = "";
$schema = $_SERVER['SERVER_PORT'] == '443' ? 'https' : 'http';
$host = strlen($_SERVER['HTTP_HOST'])?$_SERVER['HTTP_HOST']:$_SERVER['SERVER_NAME'];

if (strpos($thePostURL,"://") === false) {
if (strpos($thePage,"/") !== 0) {
$thePostURL = substr($_SERVER["PHP_SELF"],0,strrpos($_SERVER["PHP_SELF"],"/")+1) . $thePostURL;
}
if (strpos($thePostURL,"#") !== false) {
$anchor = substr($thePostURL,strpos($thePostURL,"#"));
$thePostURL = substr($thePostURL,0,strpos($thePostURL,"#"));
}
if (strpos($thePostURL,"?") !== false) {
$urlParams = substr($thePostURL,strpos($thePostURL,"?"));
$thePostURL = substr($thePostURL,0,strpos($thePostURL,"?"));
}
$thePostURL = $schema."://".str_replace("%2F","/",$host.rawurlencode($thePostURL)).$urlParams;
}
while (!(strpos($thePostURL,"/../") === false)) {
$thePostURL = substr($thePostURL, 0, strrpos(substr($thePostURL,0,strpos($thePostURL,"/../")),"/")+1).substr($thePostURL,strpos($thePostURL,"/../")+4);
}

if (isset($_SERVER['QUERY_STRING']) && ($_SERVER['QUERY_STRING'] != '')) {
if (strpos($thePostURL,"?") !== false) {
$thePostURL.= "&" . ($_SERVER['QUERY_STRING']);
} else {
$thePostURL.= "?" . ($_SERVER['QUERY_STRING']);
}
}
header("Location: ". $thePostURL.$anchor);
exit;
}

This one will account for anchors to allow this technique to work.

[Martin]

Hi Ray,

Thanks for the function code update. I have copied it over and overwritten the function that was there.

I have uploaded the script and I have gone back and tested my form with the

<?php //WAFV_Conditional contact.php#sName contact(1:)
}
}
}?>/>

Unfortunately I can see from testing that #sName inline anchor is not being appended to the URL even with your updated script.

Just to confirm, I have the #sName in the correct location?

Thanks for all your help!

[Ray Borduin]

No... the place you need it is on top of the page:

$WAFV_Redirect = "WAFV_Conditional contact.php#firsterror";

then inside each show if region you would add anchors like:

<div class="red" style="text-align:left;">*Student Name is Required</div>
<a name="firsterror" id="student_name_anchor"></a>

[Martin]

Hi Ray,

Thanks for getting back to me! I was able to get working what you suggested. So what I did was put up in the header code the following.

<?php
if ((((isset($_POST["submit"]))?$_POST["submit"]:"") != "")) {
$WAFV_Redirect = "contact.php#error";
$_SESSION['WAVT_contact_Errors'] = "";
if ($WAFV_Redirect == "") {
$WAFV_Redirect = $_SERVER["PHP_SELF"];
}
$WAFV_Errors = "";
$WAFV_Errors .= WAValidateRQ(((isset($_POST["studentName"]))?$_POST["studentName"]:"") . "",false,1);
$WAFV_Errors .= WAValidateEM(((isset($_POST["studentEmail"]))?$_POST["studentEmail"]:"") . "",true,2);
$WAFV_Errors .= WAValidatePN(((isset($_POST["dayPhone"]))?$_POST["dayPhone"]:"") . "",true,false,true,3);
$WAFV_Errors .= WAValidateLE(((isset($_POST["Security_code"]))?strtolower($_POST["Security_code"]):"") . "",((isset($_SESSION["captcha_1"]))?strtolower($_SESSION["captcha_1"]):"") . "",true,4);

if ($WAFV_Errors != "") {
PostResult($WAFV_Redirect,$WAFV_Errors,"contact");
}
}
?>

I changed the value under WAFV redirect to the contact.php#error (I renamed it error).

So what I did was move down to each place that I wanted the anchor to appear (so that I could control where the page jumped to) and put the following conditional validation, with the same name (but different id).

<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "1" . ",") !== false || "1" == "")) {
if (!(false)) {
?>
<a name="error" id="sName"></a>
<?php //WAFV_Conditional contact.php contact(1:)
}
}
}?>

I did this for all the other validations on the page (there are obviousely four of them).

My question is this, you had named your error, firsterror. Using your naming convention would I then have had to name the other anchors seconderror, thirderror and so on? Or would have left all the multiple errors as firsterror?

Is the way that I handled it by calling all my anchor names error the best way to handle multiple validations? Because as we know the user may have filled in their name, but not their e-mail and that is where I would have needed the form to jump to.

Cheers and thanks for all your help!

Martin

[Ray Borduin]

I was implying to name them all "firsterror" as you have. I just named it that, because it will jump to the first one displayed, which will effectively always be the first error on the page.

[Martin]

Thanks Ray, that works!

Much appreciated.