¿Cómo volver a cargar la página actual sin perder ningún dato de formulario?

¿Puedo volver a cargar la página actual sin perder ningún dato de formulario? Solía..

window.location = window.location.href; 

y

 window.location.reload(true); 

Pero estas dos cosas no pueden obtener datos de forma anteriores para mí. Qué está mal ? Cuando actualice el navegador manualmente, está bien (no pierdo ningún dato de formulario). Por favor, guíame cómo resolverlo.

Aquí está mi código completo …

 
Name: (*)
Email: (*)
Phone: 
Subject: (*)
Detail: 
[Personal information handling policy]

Y en mi archivo JS …

 function bind() { $('#btnConfirm').click(function(e) { if ($('#confirmCheck').is(":checked")) { getConfirmationForSendFAQ(); } else { e.preventDefault(); showalert("You should accept \"Personal Information Policy\" !", "alert-error"); } });};function getConfirmationForSendFAQ() { var name = $('#inputName').val(); var email = $('#inputEmail').val(); var phone = $('#inputPhone').val(); var subject = $('#inputSubject').val(); var detail = $('#inputDetail').val(); $('.form-actions').empty(); html = []; html.push("<table cellpadding ='8' class = 'submitInfo'"); html.push(""); html.push("Name:
"); html.push(""+ name +""); html.push(""); html.push(""); html.push("Email Address:
"); html.push(""+ email +""); html.push(""); if (phone.trim().length > 0) { html.push(""); html.push("Phone No:
"); html.push(""+ phone +""); html.push(""); } html.push(""); html.push("Subject:
"); html.push(""+ subject +""); html.push(""); html.push(""); html.push("Detail Info:"); html.push(""+ detail +""); html.push(""); html.push(""); html.push("
"); html.push(""); html.push(""); html.push("
"); html.push(""); $('.form-actions').append(html.join('')); $('#btnReturn').click(function(e) { // HERE I WANT TO KNOW HOW TO DO..... }); $('#btnSend').click(function(e) { alert("Doom"); });}

Puede usar varios mecanismos de almacenamiento local para almacenar estos datos en el navegador, como Web Storage, IndexedDB, WebSQL (obsoleto) y File API (obsoleto y solo disponible en Chrome) (y UserData con IE).

El más sencillo y ampliamente soportado es WebStorage, donde tiene almacenamiento persistente ( localStorage ) o sesión ( sessionStorage ) que está en la memoria hasta que cierre el navegador. Ambos comparten la misma API.

Por ejemplo (simplificado) puede hacer algo como esto cuando la página está a punto de volver a cargarse:

 window.onbeforeunload = function() { localStorage.setItem(name, $('#inputName').val()); localStorage.setItem(email, $('#inputEmail').val()); localStorage.setItem(phone, $('#inputPhone').val()); localStorage.setItem(subject, $('#inputSubject').val()); localStorage.setItem(detail, $('#inputDetail').val()); // ... } 

El almacenamiento web funciona sincrónicamente, de modo que esto puede funcionar aquí. Opcionalmente puede almacenar los datos para cada evento de desenfoque en los elementos donde se ingresan los datos.

En la carga de la página puede verificar:

 window.onload = function() { var name = localStorage.getItem(name); if (name !== null) $('#inputName').val(name); // ... } 

getItem devuelve null si los datos no existen.

Use sessionStorage lugar de localStorage si desea almacenar solo temporalmente.

Modifiqué el código de K3N para que funcione para mi propósito, y agregué algunos comentarios para ayudar a otros a descubrir cómo funciona sessionStorage.

  

Encuentra esto en GitHub. Especialmente creado para eso.

https://gist.github.com/zaus/4717416

Esta respuesta fue extremadamente útil para mí, y ahorra el problema de pasar por cada campo de forma manual:

Usando jQuery para almacenar el estado de una forma complicada

 window.location.reload() // without passing true as argument 

funciona para mi.

Por lo general, envío automáticamente mi propio formulario al servidor y vuelvo a cargar la página con argumentos completos. Reemplace los argumentos del marcador de posición con los parámetros que recibió su servidor.

Como mencionan algunas respuestas, localStorage es una buena opción y ciertamente puedes hacerlo tú mismo, pero si estás buscando una opción pulida, ya hay un proyecto en GitHub que hace esto llamado garlic.js .

Tienes que enviar datos y volver a cargar la página (formulario de renderizado del lado del servidor con los datos), simplemente la recarga no conservará los datos. Es solo que su navegador podría estar almacenando en caché los datos del formulario en la actualización manual (no los mismos en todos los navegadores).

De acuerdo con HTML5 LocaStorage. Este es un código de ejemplo

Puede usar localStorage ( http://www.w3schools.com/html/html5_webstorage.asp ) para guardar los valores antes de actualizar la página.