En alg\u00fan momento te habr\u00e1s topado con formulario que tienen varias etapas y por alg\u00fan motivo debes recargar la pagina para seguir al siguiente paso y claro como aun no termina el registro no consideramos apropiado guardar aun esto a la base de datos y es algo engorroso estar creando una tabla temporal.<\/p>\n
las soluciones pueden ser meterlo todo en una session en php\u00a0 o utilizando lo nuevo (OK no tan nuevo) de javascript LocalStorage<\/a>.<\/p>\n Grabaremos en LocalStorage<\/a>\u00a0en tiempo real<\/strong><\/p><\/blockquote>\n para ellos la idea es simple usaremos una funci\u00f3n nativa setInterval<\/a>\u00a0\u00a0<\/strong>para\u00a0guarde cada segundo lo que tengamos en los input’s.<\/p>\n Explico que hace el script y es algo simple usamos each para hacer un recorrido por todos los input , select y textarea (se puede agregar mas tipos) que tengamos en el DOM<\/a>\u00a0y capturamos el valor y lo metemos en variables localstorage que creamos con el nombre del elemento\u00a0sea\u00a0input , select\u00a0o\u00a0 textarea y con su valor, esto sucedera cada segundo. les dejo un ejemplo en funcionamiento:<\/p>\ncomo funciona?<\/h4>\n
\nVolvemos hacer otro recorrido de lo de los elementos\u00a0\u00a0input , select\u00a0o\u00a0\u00a0textarea para obtener los datos de los localstorage ya que\u00a0\u00a0para identificarlos necesitamos los nombres de estos elementos.<\/p>\nEl script<\/h4>\n
\r\n$(document).ready(function(){\r\n\r\n $('input[type=\"text\"],select,textarea').each(function(){ \r\n var name = $(this).attr('name'); \r\n value=localStorage.getItem(name);\r\n var value = $(this).val(value);\r\n })\r\n\r\n setInterval(function(){\r\n $('input[type=\"text\"],select,textarea').each(function(){ \r\n var name = $(this).attr('name');\r\n var value = $(this).val();\r\n localStorage.setItem(name, value);\r\n })\r\n \r\n\r\n }, 1000); \r\n })\r\n<\/code>\r\n<\/pre>\n