CODEWITHSUNDEEP
javascriptjqueryhtml
Vishal
Vishal

Reputation: 6368

why autofocus does not work on input element

Here is my HTML:

<table id="tbl">
  <tr id="tx"><td><input type="text"/></td><td><input type="text" class="last" /></td></tr>
</table>

Here is my jQuery:

$("#tbl").on("blur", ".last:last", function(){
    $("#tbl").append('<tr><td><input type="text" autofocus/></td><td><input type="text" class="last" /></td></tr>');
});

As you can see in the above mentioned code, I am trying to append a row to the table when last cell of last row loses focus. The above code works fine, but now I want to focus the first cell of newly added row, when it is created. So, I would like to ask that why html5 autofocus does not work in my case?

Here is the link to my jsfiddle

Upvotes: 0

Views: 399

Answers (2)

Rohit
Rohit

Reputation: 1812

Addition to @LoneRanger answer I would like to add why autofocus is not working.

autofocus automatically get focus when page loads. In your case page is not get loaded but only DOM gets changed. Read this http://www.html5tutorial.info/html5-autofocus.php

Upvotes: 1

LoneRanger
LoneRanger

Reputation: 117

I have modified your script this works fine.

<script>
$("#tbl").on("blur", ".last:last", function(){
    $("#tbl").append('<tr><td><input type="text"  class="focus_this" autofocus /></td><td><input type="text" class="last" /></td></tr>');
    $(".focus_this").focus();
    $('.focus_this').removeClass('focus_this');
});
</script>

Upvotes: 3

Related Questions