以下是当前的脚本:
<script type="text/javascript">
$(document).ready(function () {
$.ajax({
url: '/Home/NewPopulation',
dataType: "json",
type: "POST",
contentType: 'application/json; charset=utf-8',
data: {},
success: function (data) {
var tr;
console.log(data);
for (var i = 0; i < data.length; i++) {
tr = tr + "<tr>";
tr = tr + "<td style='display: none'>" + data[i].PollSurveyID + "</td>"
tr = tr + "<td>" + data[i].PollSurveyName + "</td>";
tr = tr + "<td>" + data[i].PollSurveyDescription + "</td>";
tr = tr + "<td>" + data[i].CategoryName + "</td>";
tr = tr + "<td>" + data[i].StartDate + "</td>";
tr = tr + "<td>" + data[i].EndDate + "</td>";
tr = tr + "<td><a class='editRow' ><i class='fa fa-edit'></i></a></td>";
//tr = tr + "<td><input type='button' id='btnDelete' value='Delete' /><i class='fa fa - close'></i></td > ";
tr = tr + "<td><a class='delRow'><i class='fa fa-trash'></i></a></td>";
tr = tr + "</tr>";
}
$('#tblPopulation').append(tr);
tblFormate();
},
error: function (xhr) {
alert('No Valid Data');
}
});
$('#tblPopulation').on('click', '.delRow', function () {
var table = $('#tblPopulation').DataTable();
table
.row($(this).parents('tr'))
.remove()
.draw();
});
function deleteRow(row) {
var i = row.parentNode.parentNode.rowIndex;
document.getElementById("#tblPopulation").deleteRow(i);
}
function tblFormate() {
var table = $('#tblPopulation').DataTable(
{
//"searching": false,
"lengthMenu": [[5, 10, 50, 100, 150, -1], [5, 10, 50, 100, 150, "All"]]
});
//Apply the search
table.columns().eq(0).each(function (colIdx) {
$('input', table.column(colIdx).header()).on('keyup change', function () {
table
.column(colIdx)
.search(this.value)
.draw();
});
});
}
});
</script>
这是我的数据表的JavaScript,具有编辑和删除按钮。对于编辑我尝试了很多东西,但没有得到按钮的响应。我想要的是当我点击编辑按钮时,所有细节必须分别填入下面的部分。除名称外,其他控件均为下拉列表,以便用户可以更改类别或状态。
我这样做的想法就是当我点击一行 PollId 的编辑按钮发送到隐藏的文本框时,在该列中取一个隐藏的列并进行 PollId 。基于文本框值,所有控制器都会填充,因为我有一个函数,它将 PollId 作为参数,并返回针对该轮询或调查的所有详细信息。 欢迎任何其他想法。附上页面图片以粗略了解流程。
[