ASP.NET MVC 4 与淘汰赛

Posted 2023-03-27

【中文标题】ASP.NET MVC 4 与淘汰赛

【英文标题】：ASP.NET MVC 4 With knockout

【发布时间】：2016-11-03 14:44:53

【问题描述】：

我正在使用 Asp.net MVC。我需要使用 Knockout 验证表单提交上的所有输入字段。

我的观点在下面。如何使用淘汰赛应用验证。我不想为每个字段都应用 Observable。

Form Code

<div data-bind="with:Student">
    <form method="post" action="/Home/Save">
    <div>
        <label>Name</label>
        <input type="text" id="txtName" name="Name" data-bind="value:Name" />
    </div>

    <div>
        <label>Age</label>
        <input type="text" id="txtAge" name="Age" data-bind="value:Age" />
    </div>
    <div>
        <label>DOB</label>
        <input type="text" id="txtDOB" name="Age" data-bind="value:DOB" />
    </div>

    <div>
        <label>Street Name</label>
        <input type="text" id="txtStreetName" name="StreetName" data-bind="value:StreetName" />
    </div>
    <div>
        <label>Address</label>
        <input type="text" id="txtAddress" name="Address" data-bind="value:Address" />
    </div>

    <div>
        <label>City</label>
        <input type="text" id="txtCity" name="City" data-bind="value:City" />
    </div>
    <div>
        <label>State</label>
        <input type="text" id="txtState" name="State" data-bind="value:State" />
    </div>
    <div>
        <label>Country</label>
        <input type="text" id="txtCountry" name="Country" data-bind="value:Country" />
    </div>
    <div>
        <label>Email</label>
        <input type="text" id="txtEmail" name="Email" data-bind="value:Email" />
    </div>
    <div>
        <label>Mobile</label>
        <input type="text" id="txtMobile" name="Mobile" data-bind="value:Mobile" />
    </div>
    <button data-bind="click: submit">Submit</button>
    </form>
</div>

【问题讨论】：

请 (a) 以文本而不是图像的形式分享您的代码，并 (b) 向我们展示您已经尝试过什么以及出了什么问题。

@user3297291 请查找代码。我想验证所有字段。而且我主要需要泛型类型，以便我可以为其他页面实现

【参考方案1】：

如果您使用的是 ASP.NET MVC，为什么不从模型中提取所有这些数据？

如果你创建了一个模型，你可以在字段的声明中添加验证：

using System.ComponentModel.DataAnnotations;

namespace YourProject.Models 

    public class ModelName 

        [Required(ErrorMessage = "Please enter your name")]
        public string Name  get; set; 

        [Required(ErrorMessage = "Please enter your Age")]
        public string Age  get; set; 

        [Required(ErrorMessage = "Please enter your DOB")]
        public string DOB  get; set; 

        [Required(ErrorMessage = "Please enter your Street Name")]
        public string STreetName  get; set; 

        [Required(ErrorMessage = "Please enter your Address")]
        public string Address  get; set; 

        [Required(ErrorMessage = "Please enter your City")]
        public string City  get; set; 

        [Required(ErrorMessage = "Please enter your State")]
        public string State  get; set; 

        [Required(ErrorMessage = "Please enter your Country")]
        public string Country  get; set; 

        [Required(ErrorMessage = "Please enter your Email")]
        [RegularExpression(".+\\@.+\\..+", ErrorMessage="Enter Valid Email")]
        public string Email  get; set; 

        [Required(ErrorMessage = "Please enter your Mobile")]
        public string Mobile  get; set; 
    

如果您进行一些研究，您可以找到其他可以通过这种方式验证数据的方法，例如限制为特定长度或特定类型的字符。我真的不知道您在验证方面还需要什么，但这肯定会有所帮助，而且我还假设您具备 MVC 的基本知识，可以通过控制器将模型传递给您的视图。

【讨论】：

我已经知道这个模型验证，但我不想在 C# 结束时申请（数据注释）。我需要在脚本端（客户端）应用所有内容。谢谢你的建议

【参考方案2】：

看看 github 上的this 淘汰赛验证库。使用方便。只需扩展您想要添加验证的可观察对象。您还可以在视图中使用 html5 验证属性。

【讨论】：

我已经看到这个并且也申请了。我希望这个扩展方法在脚本端成为通用类型。由于我使用了很多表单，如果它是泛型类型验证会很容易。

我不确定您所说的“通用”是什么意思。无论是在客户端还是服务器上应用验证，总会涉及到一些工作。我的建议是使用敲除验证文档中演示的 html 属性。这几乎不需要您做任何工作，例如 其他值得一看的是knockout validation rule engine 库。免责声明：我自己从未使用过它:)