[英]How can I dynamically generate a table row with it's tds?
I have a table like this: 我有一张这样的桌子:
<table id="myTable" cellspacing="0" cellpadding="10" border="0" width="100%">
<tbody>
....
<tr style="color: blue;" id="bankRecord377">
<td align="center" class="styleOdd"> <input type="checkbox" value="377" name="377"></td>
<td align="center" class="styleOdd">377</td>
<td align="center" class="styleOdd"></td>
<td align="center" class="styleOdd">391</td>
</tr>
....
<tr style="color: blue;" id="bankRecord386">
<td align="center" class="styleEven"> <input type="checkbox" value="386" name="386"></td>
<td align="center" class="styleEven">386</td>
<td align="center" class="styleEven"></td>
<td align="center" class="styleEven">396</td>
</tr>
...
<tr style="color: blue;" id="bankRecord322">
<td align="center" class="styleEven"> <input type="checkbox" value="322" name="386"></td>
<td align="center" class="styleEven">322</td>
<td align="center" class="styleEven"></td>
<td align="center" class="styleEven">314</td>
</tr>
...
</tbody>
</table>
I have some input fields and user inserts some information there. 我有一些输入字段,用户在其中插入了一些信息。 After that, I want to dynamically add a tr to the top of my table.
之后,我想将tr动态添加到表的顶部。 I mean I want to generate that:
我的意思是我想生成:
<tr style="color: blue;" id="bankRecord310">
<td align="center" class="styleEven"> <input type="checkbox" value="310" name="386"></td>
<td align="center" class="styleEven">318</td>
<td align="center" class="styleEven"></td>
<td align="center" class="styleEven">314</td>
</tr>
with information of 310(is unique for td 1 and td 2), 318 and 314. You can set ids for tds. 信息310(对于td 1和td 2是唯一的),318和314。您可以为tds设置ID。
How can I generate dynamiacally a table row with it's tds that I will set the name, value and etc. attributes? 我如何动态生成带有tds的表行,以设置名称,值等属性?
一种快速的肮脏方法是使用jquery prepend()方法将任何html代码插入tbody的顶部,例如
$("#mytable tbody").prepend($("<tr><td>cell1</td><td>cell2</td></tr>"));
例如,您可以使用前置功能来做到这一点。
$('#TableName').prepend($("<tr><td>Name</td> <td>Address</td></tr>"));
I made an answer to you problem here: http://jsfiddle.net/wEVbU/ 我在这里回答了您的问题: http : //jsfiddle.net/wEVbU/
you can add on to that function to do whatever you want to whatever table 您可以添加到该函数以对表执行任何操作
here is the whole function that is there: 这是那里的整个功能:
function addTR(id, name, value1, value2, value3, className) {
$td = $("<td>", {
style: "text-align: center",
class: className
})
$tr = $("<tr>", {
style: "color: blue;",
id: id
})
$tr.append($td);
$tr.append($td.clone());
$tr.append($td.clone());
$tr.append($td.clone());
$($tr.children()[0]).append($("<input>", {
type: "checkbox",
value: value1,
name: name
}))
$($tr.children()[1]).html(value2)
$($tr.children()[3]).html(value3)
$('#myTable').prepend($tr);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.