在MVC5中,我尝试使用glyphicon添加/删除行。我想在.CSHTML中将“rowcount”(表行计数)从jquery传递给“For循环”(@for(int i = 0; i< rowCount; i ++))。
请参考我试图实现的图像。
脚本:
<script>
$(function () {
$('.glyphicon-plus').click(function () {
var sds = $(this);
$(this).closest("tr").clone(true).appendTo('#ruleTable');
var **rowCount** = $('#ruleTable tr').length;
});
$('.glyphicon-remove').click(function () {
$(this).closest("tr").remove();
});
});
</script>
HTML.BeginForm:
@for (int i = 0; i < rowCount; i++){
<tr>
<td>
<span class="glyphicon glyphicon-plus" stye="color:lawngreen"></span>
<span class="glyphicon glyphicon-remove" style="color:red"></span>
</td>
<td> @Html.TextBox("[" + i + "].DepartmentCode") </td>
<td> @Html.TextBox("[" + i + "].DepartmentName")</td>
</tr>
}
...谢谢
答案 0 :(得分:0)
它不可能,Jquery是服务器端的客户端for循环。所以你可以使用一个javascript或jquery函数并使用ajax来实现这个功能。 谢谢,
答案 1 :(得分:0)
You can try like this
html
<div class="table-responsive" id="DivTable">
<table class="table table-bordered" id="tbl">
<thead>
<tr>
<td>Name</td>
<td>Age</td>
<td>DOB</td>
<td>Salary</td>
<td>Industry</td>
<td>Action</td>
</tr>
</thead>
<tbody id="dtEmployeeDetails">
</table>
</div>
javascript
function GetEmployeeDetails() {
var EmployeeArray = [];
$("#dtEmployeeDetails").empty();
$.ajax({
type: "POST",
url: '@Url.Action("GetEmployeeDetails", "Employee")',
dataType: 'json',
//data: JSON.stringify({ id: '2' }),
contentType: "application/json; charset=utf-8",
success: function (data) {
$.each(data, function (key, val) {
EmployeeArray[key] = '<tr>' +
'<td>' + val.Name + '</td>' +
'<td>' + val.DateofBirth + '</td>' +
'<td>' + val.Age + '</td>' +
'<td>' + Industry + '</td>' +
'<td>' + val.Salary + '</td>' +
'<td>' + '<a class="btn btn-success btn-xs" title="Edit" id="' + val.EmpID + '" onclick="EditEmployeeDetails(this.id);">' + '<span class="glyphicon glyphicon-pencil"></span></a> ' +
'<a class="btn btn-danger btn-xs" title="Delete" id="' + val.EmpID + '" onclick="DeleteEmployeeDetails(this.id);"><span class="glyphicon glyphicon-trash"></span></a></td></tr>';
});
$("#dtEmployeeDetails").html(EmployeeArray.join(""));
if (data.length == 0) {
$("#dtEmployeeDetails").append('<td colspan="6" class="text-center">No Record Found.</td>');
}
}
});
}