从单击它的html表行中预填充表单字段 （所有这些都应该在jsp上发生）
始终将这些用于js和ui部分。
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js" type="text/javascript"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
解决方法
我正在尝试使用jquery或javascript用单击行选择的行元素填充表单字段。我尝试了在stackoverflow上找到的解决方案，以解决类似问题。我是新手，请多多包涵。
（
http://jsbin.com/rotuni/2/edit）。但是我尝试了很多次。它无法正常工作。
//html part containing the form fields which is to be pre-populated.
<body>
<form>
<label>Value1<input /></label>
<label>Value2<input /></label>
<label>Value3<input /></label>
<label>Value4<input /></label>
</form>
<table >
<thead>
<tr>
<th>value1</th>
<th>value2</th>
<th>value3</th>
<th>value4</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
js部分
$(function() {
var tableData = [
{
value1: "row1-v1",value2: "row1-v2",value3: "row1-v3",value4: "row1-v4"
},{
value1: "row2-v1",value2: "row2-v2",value3: "row2-v3",value4: "row2-v4"
}
];
var rows = $.map(tableData,function(rowData) {
var row = $("<tr></tr>");
row.append($('<td></td>').html(rowData.value1));
row.append($('<td></td>').html(rowData.value2));
row.append($('<td></td>').html(rowData.value3));
row.append($('<td></td>').html(rowData.value4));
row.on("click",function() {
fillForm(rowData);
});
return row;
});
$(".data-table").append(rows);
function fillForm(rowData) {
var form = $(".data-form");
form.find("input.value1").val(rowData.value1);
form.find("input.value2").val(rowData.value2);
form.find("input.value3").val(rowData.value3);
form.find("input.value4").val(rowData.value4);
}
});
你可能想看：