Вернуться к динамической форме после того, как представить

Question

У меня есть форма, как это:

<form action="" method="POST"> 
    <input type="text" value="name[]"> 
    <input type="submit"> 
</form> 
<a href="#" id="add">Add field</a> 

С Javascript/JQuery есть возможность добавить дополнительные поля, такие как:

$('a').click(function() 
{ 
    $('form').append($('input[type="text"]').clone()); 
    return false; 
}); 

Это просто какой-то фиктивный код, но чтобы было ясно, что это динамическая форма.

Когда эта форма отправлена, и я возвращаюсь (только с помощью кнопки «Назад» в браузере), добавленные поля со значениями исчезли!

Как справиться с этим легко?

UPDATE

Я использую CodeIgniter и валидации форм. Если форма выходит из строя, все переменные остаются там, где они есть, и я сделал какое-то пользовательское кодирование, поэтому динамические поля и там значения все еще существуют. Могу ли я использовать часть этого для того, что я пытаюсь сделать? В принципе, все уже существует для проверки формы. Теперь это должно сработать, возвращаясь к ...

Answer 1

После поиска и пытаясь в то время как я использовал sessionStorage для этого. Перед тем, как форма отправит все значения, будут сохранены в ней, и когда пользователь нажмет кнопку «Назад», все будет восстановлено. Например, прежде чем представить:

$('form').submit(function() 
{ 
    var array   = {}; 
    array['name']  = []; 
    array['counter'] = 0; 

    $('input').each(function() 
    { 
     array['name'].push($(this).val()); 
     array['counter']++; 
    }); 

    sessionStorage.setItem('input', JSON.stringify(array)); 
}); 

А на нагрузке:

if(sessionStorage.getItem('input')) 
{ 
    var array = JSON.parse(sessionStorage.getItem('input')); 

    for (var n = 0; n < (array['counter'] - 1); ++ n) 
    { 
     $('form').append($('input[type="text"]').clone()); 
    } 

    $('input').each(function(index,value) 
    { 
     $(this).val(array['name'][index]); 
    }); 

    sessionStorage.removeItem('input'); 
} 

И я написал в блоге об этом с онлайн демо: http://royduineveld.nl/blog/en/tips-trucs/449/waardes-behouden-na-verzenden-van-dynamisch-formulier/

Answer 2

Кнопка отправки отправит новый запрос на документ, выгружая текущий. Самый простой способ сохранить ваш прогресс на странице - это не выгружать его вообще. Вы можете найти простую реализацию here

Вы также можете попробовать использовать файлы cookie или локальное хранилище для хранения состояния вашего документа.

Update Я просто понял, что вы могли бы также использовать

$("form").bind('submit',function(){ 
    return false; 
}); 

Однако это не решит проблему, если вы выгрузить документ. И используйте кнопку «назад», чтобы перезагрузить его. Единственное, что может вас спасти, - это файлы cookie и локальное хранилище.