我的頁面中有一個表格,其內容是根據資料庫條目填充的。我使用foreach 回圈遍歷資料庫行并填充表。最后一列有洗掉按鈕,顯示在每一行中。此按鈕從表中洗掉該特定行。
int i = 1;
foreach (var item in Model.messages as List<Message>)
{
<tr>
<td>@i</td>
<td>@dConverter.DateConverter(@item.messageDate.ToShortDateString())</td>
<td>@dConverter.GetTime(@item.messageDate.ToString())</td>
<td>@Model.usersList.First(x => x.Id == item.senderId).department</td>
<td>
<a href="" class="message-link" data-toggle="modal" data-target="#myModal-@i">Open Message</a>
<input type="hidden" id="msg-id-@i" value="@item.messageId"/>
</td>
<td><a type="button" style="color: red" class="message-link" id="del-@i">Delete</a></td>
</tr>
i ;
}
我想使用 ajax 呼叫來完成這項任務:
<script>
$(document).ready(function(){
$('#del-@i').on("click", function(){
var msgId = $('#msg-id-@i').val();
var formData = new FormData();
formData.append("messageId", msgId);
$.ajax({
type: "POST",
url: "Messages/DeleteMessage",
contentType: false,
processData: false,
data: formData,
success: function(response){
if(response.success){
alert("The selected message removed.");
}else{
alert("Error!");
}
}
})
});
});
</script>
執行洗掉任務的操作代碼是:
[HttpPost]
public JsonResult DeleteMessage(int messageId)
{
bool response = _messageRepository.DeleteMessageById(messageId);
if(response == true)
{
return Json(new { success=true});
}
else
{
return Json(new { success=false });
}
}
問題是當我按下按鈕時,什么也沒有發生。我嘗試除錯控制器中的操作,發現按下按鈕時未呼叫此操作。javascript 和剃須刀代碼之間的id可能存在匹配錯誤。我該如何解決?
uj5u.com熱心網友回復:
問題似乎是idsjavascript 中列出的內容不會包含正確的值,i因為腳本的生成不會發生在for loop.
** 這個答案利用了最接近的 jQuery Selector
以下是我建議的更改;
- 將屬性添加到其中包含 ID 的行。
<tr msg-id="@item.messageId">
- 更改您的 js 以確定單擊按鈕的行并提取該 ID。
$(document).ready(function(){
$('.message-link').on("click", function(){
var msgId = $(this).closest("tr").attr("msg-id");
var formData = new FormData();
formData.append("messageId", parseFloat(msgId));
$.ajax({
type: "POST",
url: "Messages/DeleteMessage",
contentType: false,
processData: false,
data: formData,
success: function(response){
if(response.success){
alert("The selected message removed.");
}else{
alert("Error!");
}
}
})
});
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/406159.html
標籤:
下一篇:單擊時在元素中切換 /-
