up one level
---
2015-08-07
HTML Form With JavaScript – How to Make the First Text Field Autofocus
I’m happy that I was able to make my html form autofocus the first field by default. with JavaScript.
In my case, for my mzz-cases-notes.php form, what this meant is three changes:
( Note: my mzz-cases-notes.php form is hosted at https://github.com/mjassen/mzz-cases-notes )
1.
I added this between the head tags, just before the closing head tag:
<script type="text/javascript">
function FocusOnInput()
{
document.getElementById("description").focus();
}
</script>
2.
I added to the opening body tag, to make this:
<body onload="FocusOnInput()">
3.
I added this in the HTML/PHP code for the form’s text field:
echo "<input type=’text’ name=’".$result[$i][1]."’
id=’".$result[$i][1]."’ style=’width:250px;’/> ";
The Link to the commit with the change: https://github.com/mjassen/mzz-ca...33/mzz-cases-notes.php
That’s how I I was able to make my html form autofocus the first field by default.
References: I used this stackoverflow example to help me along the way:
http://stackoverflow.com/questio...-on-page-load
[2019 edit: Moved to: https://i̶n̶v̶e̶s̶t̶o̶r̶w̶o̶r̶k̶e̶r̶.̶c̶o̶m̶/2015/... .html.]