save form before sending it

I hope you can help me please. I have a PHP document called registro.php At the beginning I have a php code to save verify if I'm already logged in, after that I have my HTML with 6 forms, each form represents a step, I show an example below:

            <div id="DatosPersonales" class="contenidoPestania">       
                <form name="misDatos" id="misDatos" method="post" action="post.php">
                    <table>                     
                        <tr>
                            <td colspan="4"><h4 class="encabezado">Domicilio actual:</h4></td>
                        </tr>
                        <tr>
                            <td><span class="obligatorio">*</span>Calle:</td><td colspan="4"><input tabindex="14" type="text" size="127" id="calle" name="calle" value="" required></td>
                            <td>No. Ext:<input tabindex="15" type="text" size="4" id="noExterior" required></td>
                            <td>No. Int:<input tabindex="16" type="text" size="4" id="noInterior"></td>
                        </tr>
                        <tr>
                            <td><span class="obligatorio">*</span>Colonia:</td><td colspan="3"><input tabindex="17" type="text" id="colonia" required></td>
                            <td><span class="obligatorio">*</span>Municipio/Delegaci&oacute;n:</td><td colspan="2"><input tabindex="18" type="text" id="localidad" required></td>                       
                        </tr>                        
                        <tr>
                            <td><span class="obligatorio">*</span>C.P.:</td><td><input tabindex="19" pattern="[0-9]{5,5}" id="cp" required></td>
                            <td><span class="obligatorio">*</span>Entidad:</td><td colspan="2"><input tabindex="20" type="text" id="estado" required></td>
                            <td><span class="obligatorio">*</span>Pa&iacute;s:</td><td><input tabindex="21" type="text" id="pais" required></td>                            
                        </tr>         
                    </table>           
                </form>                    
                <br><a href='menu.php?u=<?php echo $usuario;?>'><input type='button' value='<<Regresar'></a>
                <input tabindex="22" type="button" id="btnSiguiente1" onClick="validarPaso1()" value="Siguiente>>"><br><br>
            </div>

And the following 5 forms keep the same style, as you can see Onclick serves to JS validate certain things, it is worth mentioning that it is also receiving the data because in the end, JS is the one who sends the data of the 6 forms. The problem I have and I hope you help me is that if I go to step 5 and update the page, I go back to step 1 and all the data is deleted. My question is how I can save this data in session variables for example in case I get to update the data keep there and just have to give next and continue to where I stay. I hope you can help me as I try different ways and I can not solve my problem THANKS !!