我有一个带有“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);
...
答案 0 :(得分:1)
由于您要动态地将新输入/按钮附加到dom并且不通过制作ajax调用/提交表单来保存其状态,因此在重新加载页面后无法保留输入/按钮。
使用localStorage,保留先前添加的输入/按钮的信息将是更可取的。
PS:既然你没有添加你尝试过的任何代码,那么很难用特定的代码来解释localStorage。
一旦附加,将表单的状态添加到localStorage中, 加载页面时,请查找localStorage以检查以前添加的输入 您可以将项目设置为localStorage:
window.localStorage.setItem('key','value')
您可以像这样检索它们:
window.localStorage.getItem('key')