使用load->view时的Codeigniter动态javascript

Question

我有一个带有«newInput»按钮的表单，当我单击它时，它会在javascript中动态添加一个新的输入。

当我的表单出现错误时，我会用表单重新加载视图。这很正常但是..。因为我使用动态javascript来添加新的输入，所以当我重新加载时，所有添加的输入都会被删除。

我能做点什么吗？

这是我的view.tpl的一个例子：

<input type="text"  placeholder="ex: cerise" 
                    onfocus="javascript:autoComplet('jigd1', '{site_url('recettes/getIngredient')}')" value="{set_value('igd[]')}" id="jigd1" name="igd[]"/>
                            {form_error('igd[]')}

我添加了js文件的部分代码。

var cpt=1;
function addField(uriIngredient, uriLabel) {
try 
{
cpt=cpt+1;
var inputIgd = document.createElement('input'), 
button = document.createElement('input'),
div = document.createElement('div'),
inputIgd.setAttribute('type','text');
inputIgd.setAttribute('name','igd[]');
inputIgd.setAttribute('id','jigd'+cpt);


button.setAttribute('type','button');
button.setAttribute('onclick','javascript:supField("igd'+cpt+'")');
button.setAttribute('value','Supprimer');
div.setAttribute('id','igd'+cpt);
div.appendChild(inputIgd);
div.appendChild(button);
document.getElementById("listIgd").appendChild(div);
...

Answer 1

由于您是动态地将新的输入/按钮附加到dom，并且不会通过进行ajax调用/提交表单来保存其状态，因此在重新加载页面后无法保留输入/按钮。

使用localStorage，保留先前添加的输入/按钮的信息将是更可取的。

PS :因为你没有添加任何你尝试过的代码，所以很难用特定的代码来解释localStorage。

一旦你追加，将表单的状态添加到localStorage中，当你加载页面时，查找localStorage以检查之前添加的输入，您可以将项设置为localStorage：

window.localStorage.setItem('key','value')

您可以像这样检索它们：

window.localStorage.getItem('key')