Динамические поля остаются, когда возникает ошибка при отправке или обновлении

Question

У меня есть динамические поля, которые, когда я нажимаю кнопку, генерируют несколько полей, проблема заключается в том, когда я пытаюсь отправить или обновить. Сгенерированные поля не останутся, и все данные исчезли.

SCRIPT

<script type="text/javascript"> 
    $(function() 
{ 
    $(document).on('click', '.btn-add', function(e) 
    { 
     e.preventDefault(); 

     var controlForm = $('.controls form .fields:first'), 
      currentEntry = $(this).parents('.fields:first'), 
      newEntry = $(currentEntry.clone()).appendTo(controlForm); 

     newEntry.find('input').val(''); 
     controlForm.find('.btn-add:not(:last)') 
      .removeClass('btn-default').addClass('btn-danger') 
      .removeClass('btn-add').addClass('btn-remove') 

      .html('<span class="glyphicon glyphicon-minus" aria-hidden="true"></span> Remove '); 
    }).on('click', '.btn-remove', function(e) 
    { 
    $(this).parents('.fields:first').remove(); 

    e.preventDefault(); 
    return false; 
    }); 
}); 

</script> 

Answer 1

на основе кода, вы можете попробовать следующий код. Подход - это просто сохранить в localStorage, была ли нажата кнопка. Однако, если ваши данные различаются каждый раз, когда пользователь нажимает (например, данные из базы данных или это случайное генерируемое значение), тогда это не сработает.

$(function() { 
var count = parseInt(sessionStorage.getItem('Count')) || 0; 

    $(document) 
     .on('click', '.btn-add', function(e) { 
      e.preventDefault(); 

      var controlForm = $('.controls form .fields:first'), 
       currentEntry = $(this).parents('.fields:first'), 
       newEntry = $(currentEntry.clone()).appendTo(controlForm); 

      newEntry.find('input').val(''); 
      controlForm.find('.btn-add:not(:last)') 
       .removeClass('btn-default') 
       .addClass('btn-danger') 
       .removeClass('btn-add') 
       .addClass('btn-remove') 
       .html('<span class="glyphicon glyphicon-minus" aria-hidden="true"></span> Remove '); 

      //use sessionStorage 
      count++; 
      sessionStorage.setItem('Count', count); 
     }) 
     .on('click', '.btn-remove', function(e) { 
      $(this).parents('.fields:first').remove(); 

      //reset count 
      count = 0; 
      sessionStorage.setItem('Count', 0); 

      e.preventDefault(); 
      return false; 
     }); 

    for (x = 0; x < count; x++) { 
     $('.btn-add').trigger('click'); 
    } 
});