2017-01-20 60 views
1

添加的動態字段可能在刷新後仍然可見。刷新後動態字段保持可見

我發現了一個相關的主題,但它很複雜。 related topic

我想在我的工作中實現它。

小提琴

https://jsfiddle.net/jqj1h4vb/

感謝

SCRIPT

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

     var controlForm = $('.controls form:first'), 
      currentEntry = $(this).parents('.voca: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('.voca:first').remove(); 

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

HTML

<div class="container"> 


     <div class="control-group" id="fields"> 
      <div class="controls"> 
       <form role="form" autocomplete="off"> 



       <div class="row"> 

        <div class="voca"> 
        <div class="col-md-3"> 
         <input class="form-control" placeholder="Name this snippet" name="voca" type="text" value="Dynamic Form Fields - Add & Remove BS3"> 
        </div> 
        <div class="col-md-3"> 
         <input class="form-control" placeholder="Name this snippet" name="vocatrans" type="text" value="Dynamic Form Fields - Add & Remove BS3"> 
        </div> 
        <div class="col-md-1"> 
         <select class="form-control"> 
          <option>1</option> 
          <option>2</option> 
         </select> 
        </div> 
        <button type="button" class="btn btn-success btn-add" > 
         <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span> Add more 
        </button> 
        </div> 
        </div>  

       </form> 
      <br> 

      </div> 
     </div> 

</div> 
+1

@Dumisani,我相信OP試圖_keep_領域的頁面刷新後 – haxxxton

+0

相關主題是有點兒正確的,你應該將代碼包裝在onclick事件中,並將其放在自己的函數中,然後使用cookie創建一個標誌,檢查它是否設置爲刷新,如果是,則執行添加額外字段的函數 –

+0

ok先生,我會嘗試。 –

回答

0

在您的小提琴中,當腳本再次運行時,字段被移除。我沒有看到問題。如果問題仍然存在於您的瀏覽器上。請使用Ctrl + F5進行刷新。

+0

我相信OP在刷新頁面後試圖保留字段 – haxxxton

+0

是的先生它是刪除,我想要的是如果我生成它將保持可見 –

0

您可以通過兩種方式歸檔的..在會議

  1. 存儲值和數據。
  2. 在數據庫中存儲值和數據。從數據庫或會話

然後頁面加載後,你只需獲取數據