我使用ASP.NET和Bootstrap来创建网站。
在.APSX HTML文件中我有一个 JavaScript函数,它将额外的行添加到包含TextAreas的HTML表。
现在的问题是 - 如何处理服务器端新创建的Rows中的TextArea数据?
正如我所研究的那样 - 客户端通过JavaScript动态创建的任何内容都不能被"看到"在服务器端。
此外,所有额外添加的行都会在asp:button Click事件中丢失。
我已经读过您可以使用JSON以某种方式将JS数据传递到服务器端,但我不熟悉其中任何一种(我使用的JS代码是在Internet上找到的)
<table id="myTable" class="table" style="width:100%;">
<tbody>
<tr>
<td style="width:90%;">
<textarea rows="2" name="name" style="width:100%;" runat="server"></textarea>
</td>
<td style="width:10%;"> <a class="deleteRow" style="width:100%;"></a>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="5" style="text-align: left;">
<input type="button" id="addrow" value="Add Row" runat="server" />
</td>
</tr>
</tfoot>
</table>
<script>
$(document).ready(function() {
var counter = 0;
$("#addrow").on("click", function() {
counter = $('#myTable tr').length - 2;
var newRow = $("<tr>");
var cols = "";
cols += '<td style="width:90%;"><textarea rows="2" name="name" style="width:100%;" runat="server"></textarea></td>';
cols += '<td style="width:10%;"><input type="button" style="width:100%;" class="ibtnDel" value="Delete"></td>';
newRow.append(cols);
if (counter == 20) $('#addrow').attr('disabled', true).prop('value', "You've reached the limit");
$("table.table").append(newRow);
counter++;
});
$("table.table").on("change", 'input[name^="price"]', function(event) {
calculateRow($(this).closest("tr"));
calculateGrandTotal();
});
$("table.table").on("click", ".ibtnDel", function(event) {
$(this).closest("tr").remove();
calculateGrandTotal();
counter -= 1
$('#addrow').attr('disabled', false).prop('value', "Add Row");
});
});
function calculateRow(row) {
var price = +row.find('input[name^="price"]').val();
}
</script>
我是否可能以某种方式在服务器端请求表,然后通过它进行迭代?
任何帮助或提示都将不胜感激。