如何使我的 Ajax 方法从控制器调用方法-解网

问：

我有一个 .NET 6 项目，其中我有一个服务发送电子邮件并在成功时返回一个布尔值。我有一个控制器调用该方法并返回 JSON（值成功）。我还有一个视图，窗体在哪里，我有我的 Ajax 方法从控制器调用该方法。

问题是，当我单击提交按钮提交表单时，我无法到达控制器中方法的断点，因此我认为 Ajax 方法未正确调用。但是页面只是重新加载。

控制器方法：

[HttpPost]
public async Task<IActionResult> PreInscription([FromBody]
PreInscription preInscription){

    var inscriptionService =
    serviceProvider.GetRequiredService<IInscriptionService>();

        if (ModelState.IsValid)
        {
            var isSend = await
        inscriptionService.SendEmailPreInscription(preInscription);

            if (isSend)
                return Json(new { response = "success" });
        }
        return Json(new { response = "failed" });
}

视图：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>

<script>

    function runMethod(){
        $.ajax({
            url: '@Url.ActionLink("PreInscription", "Inscription")',
            type: 'POST',
            dataType: 'Json',
            async: true,
            contentType: "application/json; charset=utf-8",
            success: function (response) {
                alert(response);
            }
        });
    }

    $(document).ready(function () {

        $('form').submit(function () {
            runMethod();
        });

    });
</script>


<form asp-action="">
  <button id="submitButton" class="btn btn-large btn-theme margintop10"
    type="submit">Envoyer</button>
</form>

JavaScript C# jquery .net ajax

[HttpPost]
public async Task<IActionResult> PreInscription([FromBody] PreInscription preInscription)
{
    var inscriptionService = serviceProvider.GetRequiredService<IInscriptionService>();

    if (ModelState.IsValid)
    {
        var isSend = await inscriptionService.SendEmailPreInscription(preInscription);

        if (isSend)
            return Json(new { response = "success" });
    }
    return Json(new { response = "failed" });
}

视图：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>

<script>
    function runMethod() {
        $.ajax({
            url: '@Url.Action("PreInscription", "YourControllerName")',
            type: 'POST',
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({ /* Your form data here */ }), // Pass form data
            success: function (response) {
                alert(response.response); // Use response.response to access the JSON property
            }
        });
    }

    $(document).ready(function () {
        $('form').submit(function (event) {
            event.preventDefault(); // Prevent default form submission
            runMethod();
        });
    });
</script>

<form asp-controller="YourControllerName" asp-action="PreInscription">
    <!-- Your form fields here -->
    <button id="submitButton" class="btn btn-large btn-theme margintop10" type="submit">Envoyer</button>
</form>

将“YourControllerName”替换为 PreInscription 操作所在的控制器的实际名称。

在 AJAX 调用的数据字段中，应传递要提交到服务器的实际表单数据。您可以使用jQuery的serialize（）函数来序列化表单数据。确保您的表单字段具有与 PreInscription 模型的属性相匹配的正确名称属性。

通过这些更改，窗体现在应该通过 AJAX 将数据提交到控制器的 PreInscription 方法，并且您应该能够到达控制器中的断点。

如何使我的 Ajax 方法从控制器调用方法

How to make my Ajax method to call a method from controller

评论

评论