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

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

提问人:C Murphy 提问时间:9/25/2018 最后编辑:RubénC Murphy 更新时间:1/17/2023 访问量:304

问:

我正在创建一个 MVC 应用程序,其中我将有一个电子邮件列表的输入字段。为此,我添加了多个,以允许用户输入逗号分隔的电子邮件列表。通过这样做,我能够使用输入控件来检查电子邮件的格式是否正确(“[email protected]”)。

问题是,当我测试它时,它会自动添加 class=“input-validation-error”(即使我之前设置了 @class=“”),并且由于输入无效而不允许我发布。有没有办法允许这种情况,或者我唯一的选择是使其成为电子邮件字符串属性并通过逗号将其解析到控制器中的 EmailList 属性中?

(这是我的代码):

视图:

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

型:

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

更新:

我还应该补充一点,我正在对帖子进行 json 序列化,因此它需要采用列表的形式。理想情况下,我将能够将倍数用于电子邮件标记类型的输入,因为它将允许我需要的必要输入控件,而无需我将其作为字符串并将其写入列表。

asp.net-mvc html-helper 电子邮件验证 html.textboxfor

评论

0赞 9/25/2018
属性对你的输入没有意义,并且永远不会绑定(你回传一个字符串,而不是字符串的集合。List<string>
0赞 C Murphy 9/25/2018
电子邮件将成为 JSON 文件的一部分,附加到关联的工单,这将是自动化流程的一部分,其中它们需要以列表形式出现(假设有多个电子邮件)。但鉴于此,我是否应该将输入分配给一个字符串,然后将其拆分为字符串列表的属性并分配给字符串列表的属性(在序列化为 JSON 之前)?

答:

0赞 kblau 9/25/2018 #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 = "[email protected] (',' Delimited)",
            title = "Make sure your email(s) are formatted appropriately (and comma separated).",
            multiple = ""
        })
        <input type="submit" value="submit" />
    }
</body>
</html>

控制器/视图模型

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);
    }

评论

0赞 C Murphy 9/25/2018
谢谢,@kblau,这解决了我围绕输入控件的问题。但这是否意味着没有办法将其作为列表开始?我需要列表中的电子邮件,以便在我将电子邮件序列化为 json 文件时正确格式化。
0赞 kblau 9/26/2018
@C Murphy 添加了另一个使用属性列表的帖子
0赞 China Syndrome 9/25/2018 #2

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

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

});

评论

0赞 C Murphy 9/25/2018
嗨,@China综合症,我试过这个,但它仍然不会删除潜在的验证或让我发帖。
0赞 C Murphy 9/25/2018 #3

在查看了kblau的回答后,我意识到这是部分原因。我遇到的另一个问题(MVC单步执行我手动输入的任何客户端验证)是不显眼的验证的结果:

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

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

评论

0赞 Steve0 9/26/2018
您是否意识到删除此脚本已删除模型添加的任何不显眼的验证?如果使用 HTML 代替,则帮助程序不会引用模型来自动生成验证。似乎你刚刚用一磅 C4 杀死了一只苍蝇。html.textboxhtml.textboxfor
0赞 C Murphy 9/26/2018
是的,我明白这一点。我从未打算使用 MVC 剃须刀,因为我希望它为我自动生成验证,所以我可以手动生成它。特别是当自动验证没有正常工作时。
0赞 kblau 9/26/2018 #4

新小提琴来了,点击它 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 = "[email protected] (',' 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>

控制器/视图模型

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);
    }