Apply AJAX to an input and table without repeating it

I have a form as follows.

<form name="" method="post" action=recep.php >
   <label>NUMERO DE ASOCIADO</label><br>
   <input type="text" name="numasoc" id="numasoc" required="true" /><br>
   <label>NOMBRE</label><br>
   <input type="text" name="nombre" id="nombre"required="true"/><br>
   <label>Hora de Entrada</label><br>
   <input name="entrada" id="entrada" value="<?php echo $campo;?>" disabled="true"/><br>// $campo seria $campo = date('d-m-Y H:i:s');
   <label>Servicio Requerido</label><br>
   <select name="depart" id="depart">
      <option value="atencion" >Atención</option>
      <option value="riesgo" >Riesgo</option>
      <option value="contabilidad" >Contabilidad</option>
   </select>
   <br>
   <button name="regclie" id="boton"> Guardar</button>
   <br><br>
   <table id="format">
      <tr>
         <th>Ejemplo</th>
         <th>Mostrar</th>
         <th>Datos</th>
         <th>Lugar</th>
         <th>Accion</th>
         <th>Hora Aprox. de Atencion</th>
         <th>Tiempo</th>
      </tr>
      <tr>
         <?php 
            foreach( $funcion->MostrarTabla() as $datatabla ){ ?>
         <td><?php echo $datatabla['numeroasoc']; ?></td>
         <td><?php echo $datatabla['nombre']; ?></td>
         <td><?php echo date('d-m-Y H:i:s',strtotime($datatabla['horaentrada'])); ?></td>
         <td><?php echo $datatabla['departamento']; ?></td>
         <td><button name="pasar"  value="<?php echo $datatabla['id'];?>">Pasar</button></td>
         <td><?php echo date("H:i:s", strtotime($datatabla['horaentrada']."+30 minute"));?></td>
         <td>
            <?php 
               $fecha1 = new DateTime($datatabla['horaentrada']);//fecha inicial
               $fecha2 = new DateTime($fecha);//fecha de cierre
               $intervalo= $fecha1->diff($fecha2);
               echo $intervalo->format('%D %H:%I:%S'); ?>
         </td>
      </tr>
      <?php }?>
   </table>
</form>
<script type="text/javascript">
   refrescar();
</script>

This code when showing on the screen goes up to button "regclie" and "reprints" the code in its entirety the first part without ajax and the second one applying it.

I would like to apply the ajax without repeating it and being able to write to fill the form I do not understand much of ajax and here I show what I am using.

Any improvement will be welcome.

<script type="text/javascript">
        function refrescar() {
            var xmlHttp;
            if (window.XMLHttpRequest) {
                xmlHttp = new XMLHttpRequest();
            } else {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            var fetch_unix_timestamp = "";
            fetch_unix_timestamp = function() {
                return parseInt(new Date().getTime().toString().substring(0, 10))
            }
            var timestamp = fetch_unix_timestamp();
            xmlHttp.onreadystatechange = function() {
                if (xmlHttp.readyState == 4) {
                    document.getElementById("format").innerHTML = xmlHttp.responseText;
                    setTimeout('refrescar()', 1000);
                }
            }
            xmlHttp.open("GET", "recep.php" + "?t=" + timestamp, true);
            xmlHttp.send(null);
        }
        window.onload = function startrefresh() {
            setTimeout('refrescar()', 1000);
        }
</script>