在javascript中重复行

时间:2011-11-28 15:56:00

标签: php javascript html

我想用新名称(see this link)重复这些行。

这是代码:

<script type="text/JavaScript">
function addRow(r){
    var root = r.parentNode;//the root
    var allRows = root.getElementsByTagName('tr');//the rows' collection
    var cRow = allRows[0].cloneNode(true)//the clone of the 1st row
    var cInp = cRow.getElementsByTagName('tr');//the inputs' collection of the 1st row
    for(var i=0;i<cInp.length;i++){//changes the inputs' names (indexes the names)
    cInp[i].setAttribute('name',cInp[1].getAttribute('name')+'_'+(allRows.length+1))
}
var cSel = cRow.getElementsByTagName('select')[0];
    cSel.setAttribute('name',cSel.getAttribute('name')+'_'+(allRows.length+1));//change the selecet's name
    root.appendChild(cRow);//appends the cloned row as a new row
}

<?php
if(isset($_GET['submit'])){
    echo '<pre>';
    print_r($_GET);
    echo '</pre>';
}

?>
<form method="get" action="">

<table width="800" border="1" cellspacing="0" cellpadding="0">

<tr>
<td width="100">
    <select name="cars">
        <OPTION label="3.7.1" value="pm3_3.7.1">Camry</OPTION>
        <OPTION label="3.7" value="pm3_3.7">BMW</OPTION>
    </select>
</td>
<td width="100">
    <select name="from" >
        <option>1 </option>
        <option>2 </option>
        <option>3 </option>
        <option>4 </option>
        <option>5 </option>
        <option>6 </option>
        <option>7 </option>
        <option>8</option>
        <option>9</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
    </select>               
</td>
<td width="12%">
    <select name="to">
        <option>1 </option>
        <option>2 </option>
        <option>3 </option>
        <option>4 </option>
        <option>5 </option>
        <option>6 </option>
        <option>7 </option>
        <option>8</option>
        <option>9</option>
        <option>10</option>
        <option>11</option>
        <option>12</option>
    </select>

</td>
<td width="15%">
    <input name="model" type="text" value="" >
</td>

<td width="15%">
    <input type="text" value="" name="price">
</td>
<td width="%10">
    <input type="text" value="" name="note">
</td>
<td width="%10">
    <input name="add" type="button" value=" add " onclick="addRow(this.parentNode.parentNode)">
    <input name="remove" type="button" value=" remove " onclick="">
</td>
</tr>
</table><br /><br />
<input name="submit" type="submit" value="Submit" />
</form>

结果是

Array
(
    [cars] => pm3_3.7
    [from] => 1
    [to] => 4
    [model] => asdf
    [price] => asdf
    [note] => ewr
    [cars_2] => pm3_3.7.1
    [cars_3] => pm3_3.7
    [cars_4] => pm3_3.7.1
    [submit] => Submit
)

我想要这样的结果:

  

price_1,price_2,price_3 ......等
  note_1,note_2,note_3

我该怎么做?

2 个答案:

答案 0 :(得分:2)

在对象名称前面使用[],例如cars[]model[]price[]等...

所以结果会有些像,例如cars数组:

Array
(
    [0] => pm3_3.7
    [1] => pm3_3.7
    [2] => pm3_3.7
)

等等......然后你循环遍历它们。

答案 1 :(得分:1)

我相信你应该在这里用“i”替换“1”:

cInp[i].setAttribute('name',cInp[1].getAttribute('name')+'_'+(allRows.length+1))

所以它将是

cInp[i].setAttribute('name', cInp[i].getAttribute('name') + '_' + (allRows.length + 1));
相关问题