ASP.NET MVC Core TextBoxFor event pass model from View to Controller

Question

首先，我的職業生涯主要是在后端工作，前端什么都沒有，所以我對前端的所有知識都非常有限。

首先，我到處尋找如何在文本框中按下回車鍵時將 model 從視圖傳遞到 controller。 我查看了 ajax 和 js，但沒有示例向我展示如何傳入 model。 我走近了，結果是 model 是 null 而在 controller 操作方法中。 例如，下面的代碼我想在 Zip 文本框上有一個事件，當有人在焦點位於所述文本框中時按下 Enter 鍵時，它會將包含任何和所有值的 Model 傳遞給 GotZip Z594C103F2C6E04EC3D18Z 操作。

任何幫助將不勝感激！

幫幫我歐比旺克諾比，你是我唯一的希望……

索引.cshtml

@model MyProject.Models.MyModel
@{
    ViewBag.Title = "MyApp";
}

<div class="text-left">
    <form asp-controller="Home" asp-action="Index">
        <table>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.Name)
                    @Html.TextBoxForFor(model => model.Name)
                </th>               
            </tr>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.Address1)
                    @Html.TextBoxForFor(model => model.Address1)
                </th>               
            </tr>           
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.City)
                    @Html.TextBoxForFor(model => model.City)
                </th>               
            </tr>   
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.State)
                    @Html.TextBoxForFor(model => model.State)
                </th>               
            </tr>   
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.Zip)
                    @Html.TextBoxForFor(model => model.Zip)
                </th>               
            </tr>               
        </table>
        <input name="Submit" type="submit" asp-action="SubmitButton" value="Submit" />      
    </form>
</div>

我的模型.cs

namespace MyProject.Models
{
    public class MyModel
    {
        public string Name { get; set; }
        public string Address1 { get; set; }
        public string City { get; set; }
        public string State { get; set; }
        public string Zip { get; set; }
    }
}

家庭控制器.cs

namespace MyProject.Controllers
{
    [Authorize]
    public class HomeController : Controller
    {
        public IActionResult SubmitButton([FromForm] MyModel model)
        {
            //do stuff with model

            ModelState.Clear();

            return View("Index", myModel);
        }

        public IActionResult GotZip([FromForm] MyModel model)
        {
            //do stuff with model

            ModelState.Clear();

            return View("Index", myModel);
        }

    }
}

Answer 1

當在文本框中按下回車鍵時，如何將 model 從視圖傳遞到 controller。

我想在 Zip 文本框上有一個事件，當有人在焦點位於所述文本框中時按下 Enter 鍵時，它將通過包含任何和所有值的 Model 到 GotZip Z594C103F2C6E04C0CAZAB059F031E 操作

您的操作GotZip返回一個 ViewResult，如果您想在用戶按下文本框中的 Enter 鍵時向瀏覽器客戶端呈現視圖，您可以嘗試使用隱藏的提交按鈕並手動觸發它以將數據提交到您期望的操作，例如以下。

    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Zip)
            @Html.TextBoxFor(model => model.Zip, new { @onkeydown = "return myfunc(event);" })
        </th>
    </tr>
</table>
<input name="Submit" type="submit" asp-action="SubmitButton" value="Submit" />
<input id="SubmitToGotZip" type="submit" asp-action="GotZip" value="Submit" style="display:none;" />

JS function

function myfunc(e) {
    if (e.which == 13) {

        $("#SubmitToGotZip").click();

        return false;
    }
    return true;
}

我查看了 ajax 和 js，但沒有示例向我展示如何傳入 model。

如果您想通過 ajax 發布表單數據，您可以嘗試：

function myfunc(e) {
    if (e.which == 13) {
        var form = new FormData($('form')[0]);
         
        $.ajax({
            type: 'POST',
            url: '/home/GotZip',
            data: form,
            processData: false,
            contentType: false,
            success: function (result) {
                
                //code logic here
            },
            error: function () {
                console.log('error');
            }
        });

        return false;
    }
    return true;
}