我有一堆可以通过“添加字段”按钮连续添加的表单元素。现在我想给这些字段增加名称,例如
输入名称-xyz-1, 输入名称-xyz-2, ....
输入名称-abc-1,输入名称-abc-2,......
foo-1, foo-2, foo-3, ....
等等。
“添加字段”按钮调用一个名为 addField() 的函数,该函数操纵 dom 元素以复制节点。
我在为增量名称创建逻辑时遇到问题。你们能帮帮我吗??
这是我正在处理的代码(表单元素是 laravel 生成的)
/*THE HTML*/
<section class="input">
{{ Form::label('achievements', 'Achievements:') }}
<input class="count" name="achievements-count" type="hidden" value="1">
<p class="addedField input">
{{ Form::input('input-name-xyz-1', $competition_games, Input::old('achievement-competition'), array('id' => 'achievement-competition')); }}
{{ Form::select('input-name-abc-1', array('Year - Place'), Input::old('achievement-year'), array('id' => 'achievement-year')) }}
{{ Form::select('foo-1', array('Position', 'Gold' => 'Gold', 'Silver' => 'Silver', 'Bronze' => 'Bronze', 'Participant' => 'Participant'), Input::old('achievement-achieved'), array('id' => 'achievement-achieved')) }}
</p>
<a onclick="addField(this)">+</a>
</section>
和 javascript
function addField(elem){
var parent = elem.parentNode;
var addName = parent.id;
var count = ++(parent.getElementsByClassName("count")[0].value);
var lastNode = parent.getElementsByClassName("addedField")[count-2];
var clone = lastNode.cloneNode(true);
var nodes = clone.childNodes;
for(i=0; i<nodes.length-1; i++){
nodes[i].value = "";
nodes[i].name = //I need the logic right here//.
}
if(count == 2)
clone.innerHTML += "<a class='removeLink' onClick='removeField(this)'>X</a>";
parent.insertBefore(clone,elem);
}
——问候,阿尤什·什雷斯塔