Autofocus only working on page refresh

Question

I have a form which is in a popup, I've set the autofocus attribute `autofocus="autofocus"` but it is not focusing when the form loads however it will focus if you refresh the page. The form is inserted into a `div`. Form Sample: ``` First Name: ``` Div form is inserted into: ```

``` Form is shown if user is logged in and clicks their username: ``` if(isset($_SESSION['username'])){ echo "".$_SESSION['username'].""; } ```

Accepted Answer

`autofocus` will apply only for elements initially in the page, not elements loaded with Javascript.

You can force the focus in the Javascript code that you use to render the SimpleModal, add it to the `onShow` event:

```
$('#firstNameUserField').focus();
```

You didn't include the Javascript used to open the popup in your question, so this is just a general example:

```
$("#popupEl").modal({onShow: function (dialog) {
 $('#firstNameUserField').focus();
}});
```

Autofocus only working on page refresh

Solution

Problem