了解しました。
ご質問の内容は、ASP.NET Core MVC で View 側の JavaScript(<script>)から Ajax を使って Controller のアクションを呼び出し、Payments テーブルの paymentId に該当する行を更新するサンプル構文ですね。
以下に、Controller 側 と JavaScript 側 の両方のサンプルコードを示します。
(Entity Framework Core を使用する想定)
1. Controller 側(Ajax 受け取り用アクション)
using Microsoft.AspNetCore.Mvc;
using System.Threading.Tasks;
using YourAppNamespace.Data; // DbContext の名前空間
using YourAppNamespace.Models; // Payment モデルの名前空間
using Microsoft.EntityFrameworkCore;
public class PaymentsController : Controller
{
private readonly ApplicationDbContext _context;
public PaymentsController(ApplicationDbContext context)
{
_context = context;
}
// Ajax から呼び出す更新用アクション
[HttpPost]
public async Task<IActionResult> UpdatePayment([FromBody] PaymentUpdateDto dto)
{
if (dto == null || dto.PaymentId <= 0)
{
return BadRequest(new { message = "Invalid data." });
}
var payment = await _context.Payments.FirstOrDefaultAsync(p => p.PaymentId == dto.PaymentId);
if (payment == null)
{
return NotFound(new { message = "Payment not found." });
}
// 更新処理
payment.IncomeCategoryId = dto.IncomeCategoryId;
payment.Amount = dto.Amount;
try
{
await _context.SaveChangesAsync();
return Ok(new { message = "Payment updated successfully." });
}
catch (DbUpdateException ex)
{
return StatusCode(500, new { message = "Database update failed.", error = ex.Message });
}
}
}
// Ajax で受け取るデータ用 DTO
public class PaymentUpdateDto
{
public int PaymentId { get; set; }
public int IncomeCategoryId { get; set; }
public decimal Amount { get; set; }
}
2. View 側 JavaScript(Ajax 呼び出し部分)
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
// 例: SweetAlert2 の then 内で呼び出す
}).then((result) => {
if (paymentId != null && paymentId !== undefined && paymentId !== 0) {
const data = {
paymentId: paymentId,
incomeCategoryId: result.value.incomeCategoryId,
amount: result.value.amount
};
$.ajax({
url: '/Payments/UpdatePayment', // Controller のアクションURL
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(data),
success: function (response) {
alert(response.message);
},
error: function (xhr) {
alert("Error: " + xhr.responseJSON?.message ?? "Unknown error");
}
});
}
});
</script>
3. ポイント
- DTO(Data Transfer Object) を使って、必要なデータだけを Controller に渡す。
[FromBody] を付けることで、JSON を直接受け取れる。contentType: 'application/json' と JSON.stringify(data) をセットで使う。- エラー時も
BadRequest や NotFound を返すことで、フロント側で適切に処理できる。 await _context.SaveChangesAsync() で非同期更新。
もしご希望であれば、このサンプルを SweetAlert2 の then 内に完全統合した形 にしてお渡しできます。
そうすれば、今の View の <script> にそのまま組み込めます。
この統合版を作成しますか?
そうすれば、あなたの Index.cshtml にコピペで動く形になります。
Powered by Froala Editor