UI dialog modal form with tabs - Problem to use tabs

UI dialog modal form with tabs - Problem to use tabs

Hi,

I have a problem using dialog modal form combined with tabs and I dont find solution. Each tab is a form, i have to fill inputs form with a consult to the DB and user can edit it but form appears with blank inputs. Console show consult to DB its ok. I dont know if html form loads before or other tab is over tab with data.
  1. //Function edit used to obtain data from DB and open dialog form. Called click tr table
  2. function edit(Id)
                {
           var Id="Id="+Id;
  3.               $.ajax({
                            url:"searchdata.php",
                            type:"POST",
                            data:Id,
                            dataType:"json",
                            success:
                                function(respuesta)
                            {
                               
                              $( "#dialog-form" ).dialog({
                                       autoOpen: true,
                                       height: 600,
                                       width: 550,
                                        modal: true,
                                        open: function() {
                                              $("#tabs").tabs();
                                         },                   
                            });
     
    $('#id').val(respuesta.ID);               //this value has to be showed in the form on tab1
     $('#name').val(respuesta.name);   //this value has to be showed in the form on tab1
  4.           }
         })
    };

  6. //HTML code

  8. <div id="dialog-form">

    <div id="tabs" >
      <ul>
       <li><a id="tab1" href="formtab1.html">Info</a></li>
        <li><a id="tab2" href="formtab2.html">Payment</a></li>
      </ul>
    </div>
                      
    </div> <!--close dialog form-->