jquery focus not working on a page loaded with ajax

Question

My code

index.php

Answer 1

As your Ajax code knows all about the inputs (same page), why not just do this:

  success: function(msg)
  {
      $("#risultati").html(msg);
      $("#zio").focus();
  },

Your current version has a child page has knowledge of the parent page (bad separation).

Answer 2

You do not need to display the html code in go.php after you finish processing the POST data

Try this

$(document).ready(function() {
  $("#verifica").click(function(){
  $("#risultati").html("Please wait...");
    $.ajax({
      type: "POST",
      url: "go.php",
      data: $("#ciao").serialize(),
      //dataType: "html",
      success: function(msg)
      {
        $("#risultati").html(msg);
        $("#zio").focus();
      },
      error: function()
      {
          $("#risultati").html("An error occurred.");
      }
    });
  });
});

Answer 3

ADDITIONAL SOLUTION Had same issue where focus() didn't seem to work no matter what I tried.

Eventually turned out that what was needed was scrolling to the correct position:

• jQuery scroll to element
• $(window).scrollTop() vs. $(document).scrollTop()