Set focus onLoad

JP

Member
Here is a snippet of code you can use to set the focus onLoad to a specific form field when a user loads an insert, edit or search form on your DaDaBIK powered web site.

Open your header.php and replace your <body> tag with the following:

/* Begin code
<?php if ($function === "show_insert_form"){
echo "<body onLoad=\"document.contacts_form.your_form_field_name.focus()\">";
}
else {
if ($function === "edit"){
echo "<body onLoad=\"document.contacts_form.your_form_field_name.focus()\">";
}
else {
if ($function === "show_search_form"){
echo "<body onLoad=\"document.contacts_form.your_form_field_name.focus()\">";
}
else {
echo "<body>";
}
}
}
?>
*/ End code

The default form name in DaDaBIK is contacts_form and was not changed in the above code. The parts of the code in bold above and below would be changed to the form field name in your form.

If your insert, edit and search forms happen to be the same or you want to focus on the same field name in all three form types you could use the code below:

/* Begin code
<?php if ($function === "show_insert_form" || $function === "edit" || $function === "show_search_form"){
echo "<body onLoad=\"document.contacts_form.your_form_field_name.focus()\">";
}
else {
echo "<body>";
}
?>
*/ End code

Note: I am not using the default header.php that was installed by DaDaBIK so your <body> tag in header.php will look different if you are working with a default installation.

You can see a working demo at http://dadabik.kicks-ass.net.

 

DebbieS

DaDaBIK Guru
Actually, I did the same thing, but more generic ... to the last line of the $form code (on or about line 1226 in business_logic.php), I added the bold part below:

$form .= "<tr><td class=\"tr_button_form\" colspan=\"".$number_cols."\"><input type=\"submit\" class=\"button_form\" value=\"".$submit_buttons_ar[$form_type]."\"></td></tr></table></form><script type=\"text/javascript\">document.contacts_form.elements[0].focus();</script>";
return $form;
} // end build_form function

That sets the form focus to the first form field in the form regardless of what it's called or what type of form (in my case I did not care what view they were using).

I'm also using the same thing on my other forms on my site and works a charm. Especially nice because I never have to worry if I've changed the first field anywhere so long as I've given the correct form name.

 

JP

Member
Debbie,

You are so good. I actually like that mod even better. I did try something like that myself in the login.php form (non DaDaBIK form) by adding the javascript snippet to the bottom of the form then I learned of adding it ot he <body> tag. On the demo site I have up I would use the code you have above but on the update record page the field I need the focus on isn't the first form field. The first form field is readonly.

Wow I just looked at a form that has already been received and the focus is on Date Received like it should be for update/edit but since it is now readonly I see the cursor pegged to the right of the readonly field.

Ok if the form field is already populated or readonly can we get the onload focus to ignore that field and maybe focus on the next form field or even no field if the form has been previously updated?

 

DebbieS

DaDaBIK Guru
Well, using the method I've got, the [0] in the code is the position of the field on the page. So, in the code above, it is telling it to focus on the first form field of the form contacts_form. If you needed it to be on the second, you'd put in [1], etc., etc. Helpful if you know which form field you want the focus on.

I found this bit of code at http://www.yaldex.com/FSForms/FormFocus.htm which might be better suited to your setup.

 
Top