如何在不离开当前视图并保留当前模型的情况下在 .Net Core 中提交表单

Question

我有一个带有表单的模式，提交后我想将某些内容更新到数据库中，而不离开或刷新当前视图，也不会丢失我当前注入的模型。

让我快速解释一下。我有一个包含两个按钮的个人资料页面。一个 I have blocked your car! 和另一个 Unblock my car!。当我按下其中一个按钮时，会弹出一个模式，并要求您输入一些表单，在我提交之后，我想在按下按钮之前的个人资料页面上 return。我尝试了很多东西，但遇到了一些问题：

1.After 我登顶了注入模型变成NULL的形式 2.Void 操作将我转到空白页 3.After 提交操作未被调用，因为我有一个断点并且模型也为空 4.nothing 有效

我基本上想要：当我打开模式并输入数据时，在我提交它之后应该调用控制器中的一个方法来更新数据库中的某些内容而不更改视图或刷新它..之后我想 return 到我按下按钮之前的个人资料页面控制器：

using AspNetCoreHero.ToastNotification.Abstractions;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Logging;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Security.Claims;
using System.Threading.Tasks;
using UnblockMe.Models;
using UnblockMe.Services;

namespace UnblockMe.Controllers
{
    public class ProfileController : Controller
    {
        private readonly ILogger<ProfileController> _logger;
        private readonly IUserService _userService;
        private readonly INotyfService _notyf;
        private Users _curentUser;
        public ProfileController(ILogger<ProfileController> logger, INotyfService notyf,IUserService userService)
        {
            _logger = logger;
            _userService = userService;
            _notyf = notyf;

        }

        [Route("Profile/{id}")]
        public IActionResult Index(string id)
        {  

            return View(_userService.GetUserById(id));
        
        }

   
        public void BlockedYouAction(string Contact)
        {
       
        }
    
        public void BlockedMeAction(string Contact)
        {

         
        }
       
    }
}

查看：

@model Users
@using Microsoft.AspNetCore.Identity
@using UnblockMe.Services
@inject SignInManager<Users> SignInManager
@inject UserManager<Users> UserManager
@inject IUserService _userService
@inject ICarsService _carsService
<p>@Model.FirstName - @Model.LastName</p>
<p>@Model.PhoneNumber</p>
<p>@Model.Email</p>
<div class="container">
    @if (SignInManager.IsSignedIn(User))
    {
        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#UnblockMe">
            Unblock me!
        </button>
        <div class="modal fade" id="UnblockMe" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Unblock Me!</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <form method="post" id="form" asp-controller="Profile" asp-action="BlockedYouAction">
                            <p>Contact Method:</p>
                            <label for="ContactSMS">SMS</label>
                            <input type="radio" name="Contact" value="SMS" id="ContactSMS" checked />
                            <label for="ContactEmail">Email</label>
                            <input type="radio" name="Contact" value="Email" id="ContactEmail" />

                            <label for="cars">Choose a car:</label>
                            <select name="mycars" id="mycars">
                                @foreach (var element in _carsService.GetCarsList(_userService.GetLoggedInUser()))
                                {
                                    <option value="@element.LicensePlate">@element.LicensePlate</option>
                                }


                            </select>

                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                <button type="submit" class="btn btn-primary" id="myLink">Send</button>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Send</button>
                    </div>
                </div>
            </div>
        </div>

        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#BlockedYou">
            I have blocked you!
        </button>
        <div class="modal fade" id="BlockedYou" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">I have blocked you!</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        @Html.Partial("BlockedYou_parital", Model)
                    </div>

                </div>
            </div>
        </div>

    }
</div>
<script>
    $("#form").submit(function(e) {
    e.preventDefault();
});
</script>

目前我正在测试我已经拉黑你了！按钮，所以不要看另一个。另外我想提一下我的个人资料路线是 Profile/{user id}

Answer 1

最简单的方法是使用 ajax


@section Scripts {
<script type="text/javascript">
 $(document).ready(function () {

 $(document).on("click", "#blockYouBtn", function (e) {
        e.preventDefault();
        e.stopImmediatePropagation();

        blockYou();
    });

function blockYou() {

      var contact= //your code

        $.ajax({
            url: '/profile/BlockedYouAction',
            type: 'POST',
            data: {Contact:contact},
            success: function (result) {
             return true;
            },
            error: function (xhr, exception) {
           //error code
                return false;
            }
        });
};
});

</script>

不知道你屏蔽后需要什么。现在它什么都不做，但它可以 return 局部视图。模型和所有其他天不会改变。

如何在不离开当前视图并保留当前模型的情况下在 .Net Core 中提交表单

How can I submit a form in .Net Core without leaving the current view and keeping the curent model

c#

ajax

asp.net-core-mvc

.net-core