如何在 Razor 中单击按钮时更改我的模型值？答案

【问题标题】：How can i change my model value on button click in Razor?如何在 Razor 中单击按钮时更改我的模型值？
【发布时间】：2019-07-26 22:43:28
【问题描述】：

目前我正在做一个我有两个按钮的项目。 “Windows 登录”和“登录”。当我点击“Windows 登录”时，我想提交表单，在提交之前，我想将我的模型 choosenProvider 字符串属性值更改为“Windows”。

这是我的模型：

public class LogInUserViewModel
{

    public LogInUserViewModel() { }

    [Required]
    [Display(Name = "Name")]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }
    public string ReturnUrl { get; set; }
    public string ChoosenProvider { get; set; } = "idsrv";
}

这是我的 Razor 页面：

<body>
    <div class="background">
        <div class="login-area">
            <br />
            <div class="login-title">Control Unit Registry</div>
            <br />
            @Html.ValidationSummary(true, "", new { @class = "text-warning-login" })
            <div class="holder-form-login">
                <div class="form-group">
                    <div class="text-login">
                        @Html.LabelFor(model => model.UserName, htmlAttributes: new { @class = "control-label col-md-2" })
                        <div class="col-md-10">
                            @Html.EditorFor(model => model.UserName, new { htmlAttributes = new { @class = "input-name-login" } })
                            @Html.ValidationMessageFor(model => model.UserName, "", new { @class = "text-warning-login" })
                        </div>
                    </div>
                </div>
                <br />
                <div class="form-group">
                    <div class="text-login">
                        @Html.LabelFor(model => model.Password, htmlAttributes: new { @class = "control-label col-md-2" })
                        <div class="col-md-10">
                            @Html.EditorFor(model => model.Password, new { htmlAttributes = new { @class = "input-password-login" } })
                            @Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-warning-login" })
                        </div>
                    </div>
                </div>
            </div>
            @Html.HiddenFor(x => x.ChoosenProvider)
            <div class="form-group">
                <div class="holder-button-login">
                    <br />
                    <input type="submit" value="Login" class="button-login" />
                </div>
            </div>
            <br />
            <br />
            <div class="form-group">
                <div class="holder-button-login">
                    <br />
                    <input type="submit" value="Windows Login" class="button-login" onclick="chooseWindowsProvider()" />
                </div>
            </div>
            <br />
            <br />
            <br />
            <br />
            <div class="link-register-login">
                <a href="register">Register</a>
            </div>

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

这是我在剃须刀中的唯一页面，它完全让我发疯。你可以看到我正在经历：

@Html.HiddenFor(x => x.ChoosenProvider)

还有 javascript onclick() 但它没有改变值。

所以总结一下：我不知道如何将choosenProvider 属性值更改为“Windows”，然后在单击按钮时提交表单。

感谢任何帮助。

【问题讨论】：

chooseWindowsProvider()中有什么代码？
我已经删除了它，但它有类似 getdocumentbyid().value = "Windows" 的东西，如果我没记错的话它改变了值，但提交后值仍然是 "idsrv" 而不是 "windows" ，所以我的猜测是 js 的执行晚于提交 :)
所有这些代码都位于Html.BeginForm() 中吗？
是的，它位于一个

标签： c# razor asp.net-mvc-5

【解决方案1】：

好吧，我终于找到了，我希望它对将来的人有所帮助，也请不要说智能感知可能会告诉你字段上的 x 或 y 函数甚至不存在，但它们确实存在。

所以解决办法是js在提交之后执行，所以你需要做的是：

将按钮类型从 type="submit" 更改为 <input type="button"
然后在文件末尾插入以下脚本

<script>
    function chooseWindowsProvider() {
        document.getElementById('ChoosenProvider').value = 'Windows';
        document.getElementById('loginForm').submit();
    }
</script>

所以我们基本上是从 js 提交表单，而不是从按钮提交，这样我们就可以在提交之前分配字符串值。

一些附加信息：

 @Html.HiddenFor(x => x.ChoosenProvider)

已经包含一个 id，因为它的 HTML 结果是：

<input id="ChoosenProvider" name="ChoosenProvider" type="hidden" value="idsrv" />

最后是如何在表单中添加 id：

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "loginForm"}))

【讨论】：