如何删除多封电子邮件的文本框上的客户端验证？

Question

我正在创建一个 MVC 应用程序，其中我将有一个用于电子邮件列表的输入字段。为此，我添加了多个以允许用户输入以逗号分隔的电子邮件列表。通过这种方式，我可以使用输入控件来检查电子邮件的格式是否正确 (".+@gmail.com")。

问题是当我测试它时，它会自动添加 class="input-validation-error"（即使我事先设置了 @class=""）并且不允许我结果，由于输入无效，post。有什么方法可以做到这一点，或者我唯一的选择是使它成为电子邮件字符串属性并用逗号将其解析为控制器中的 EmailList 属性吗？

（这是我的代码）：

查看：

@Html.TextBoxFor(model => model.EmailList, new { type = "email", placeholder 
= "ex@gmail.com (',' Delimited)", title = "Make sure your email(s) are 
formatted appropriately (and comma separated).", multiple = "" })

型号：

public List<string> EmailList { get; set; }

更新：

另外补充一下，我是对post进行json序列化，所以需要是列表的形式。理想情况下，我可以将倍数用于电子邮件标签类型的输入，因为它允许我需要的必要输入控件，而无需让我将其作为字符串并将其写入列表。

Answer 1

https://dotnetfiddle.net/eadTjh

查看

@model Testy20161006.Controllers.MurphyModel
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Tut122</title>
</head>
<body>
    @if (ViewBag.Output != null)
    {
        <span>@ViewBag.Output</span>
    }
    @using (Html.BeginForm())
    {
        @Html.TextBoxFor(model => model.EmailList, new
        {
            type = "email",
            placeholder = "ex@gmail.com (',' Delimited)",
            title = "Make sure your email(s) are formatted appropriately (and comma separated).",
            multiple = ""
        })
        <input type="submit" value="submit" />
    }
</body>
</html>

Controller/View 型号

namespace Testy20161006.Controllers
{
public class MurphyModel
{
    //We don't want a list class, rather a string 
    public string EmailList { get; set; }
}

public class HomeController : Controller
{
    [HttpPost]
    public ActionResult Tut122(MurphyModel model)
    {
        var splitEmails = model.EmailList.Split(',');
        var anEmail = "These are the different emails: ";
        foreach (string email in splitEmails)
        {
            //set breakpoint here
            anEmail+= email + " and ";
        }
        anEmail = anEmail.Substring(0, anEmail.Length - 5);
        ViewBag.Output = anEmail;
        return View(model);        }

    public ActionResult Tut122()
    {
        MurphyModel model = new MurphyModel();
        return View(model);
    }

Answer 2

添加一个 js 文件希望你使用 jQuery

$(document).ready(function () {
    $("#EmailList").removeClass("input-validation-error");

});

Answer 3

查看 kblau 的回答后，我意识到这是部分原因。我运行遇到的另一个问题（MVC 越过了我手动输入的任何客户端验证）是非侵入式验证的结果：

<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

注释掉后，它允许我将输入写入字符串 Email，然后我将其分配给控制器中的字符串列表 EmailList。这最终对我有用。

Answer 4

新的fiddle来了，点击https://dotnetfiddle.net/ORYDVJ

查看

@model Testy20161006.Controllers.MurphyModel
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Tut122</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#emailField").change(function () {
                var theList = {
                    emaillist: []
                };
                var array = $('#emailField').val().split(",");
                $.each(array, function (i) {
                    theList.emaillist.push(
                        array[i]
                    );
                });
                $.ajax({
                    url: '/Home/Tut122',
                    traditional: true,
                    type: "POST",
                    contentType: "application/json",
                    data: JSON.stringify({ murphyModel: theList }),
                    success: function (data) {
                        console.log('success!!');
                        $("#theOutput").html(data)
                    }
                });
            })
        })
    </script>
</head>
<body>
    @Html.TextBoxFor(model => model.EmailList, new
            {
                id = "emailField",
                type = "email",
                placeholder = "ex@gmail.com (',' Delimited)",
                title = "Make sure your email(s) are formatted appropriately (and comma separated).",
                multiple = ""
            })
    <span>The output data:</span>
    <div id="theOutput">
    </div>
</body>
</html>

Controller/View 型号

public class MurphyModel
{
    public List<string> EmailList { get; set; }
}

public class HomeController : Controller
{
    [HttpPost]
    public string Tut122(MurphyModel murphyModel)
    {
        //You need to get Newtonsoft.JSON
        var json = JsonConvert.SerializeObject(murphyModel);
        return json;
    }

    public ActionResult Tut122()
    {
        MurphyModel model = new MurphyModel();
        return View(model);
    }

如何删除多封电子邮件的文本框上的客户端验证？

How to Remove Client-Side Validation on a textboxfor for multiple emails?

asp.net-mvc

html-helper

html-email

html.textboxfor