如何在 ASP.NET MVC 5 中使用 Ajax 效果扩展 HtmlHelper

本文关键字：Ajax HtmlHelper 扩展 ASP NET MVC | 更新日期: 2023-09-27 18:33:12

这是一个

ASP.NET MVC 5项目。

我延长了HtmlHelper.她的代码：

public static class ValidationMessageExtend
{
    public static HtmlString ValidateionUseridTooltip(this HtmlHelper helper, string name)
    {
        if (
            helper.ViewData.ModelState[name] == null ||
            helper.ViewData.ModelState[name].Errors == null ||
            helper.ViewData.ModelState[name].Errors.Count == 0
            )
        {
            return new HtmlString("");
        }
        TagBuilder innerTag = new TagBuilder("div");
        innerTag.Attributes.Add("class", "tooltip-inner");
        innerTag.InnerHtml = helper.ViewData.ModelState[name].Errors[0].ErrorMessage;
        TagBuilder tag = new TagBuilder("div");
        tag.Attributes.Add("class", "tooltip fade top in");
        tag.Attributes.Add("role", "tooltip");
        tag.Attributes.Add("id", "tooltip387165");
        tag.Attributes.Add("style", "top: 5px; left: 55px; display: block;");
        tag.InnerHtml = "<div class='tooltip-arrow' style='left: 50 %;'></div>" + innerTag.ToString(TagRenderMode.Normal);
        return new HtmlString(tag.ToString(TagRenderMode.Normal));
    }
}

此扩展的目的是更改@Html.ValidationMessageFor默认样式。

我认为，我已包括jquery.unobtrusive-ajax.js和jquery.validate.js。

我想使用我自己的扩展@Html.ValidateionUseridTooltip("UserID")。它不能与使用 @Html.ValidationMessageFor 相同，并且必须在不刷新页面的情况下触发验证。

我怎样才能做到这一点？

如何在 ASP.NET MVC 5 中使用 Ajax 效果扩展 HtmlHelper

如果您检查 @Html.ValidationMessageFor() 方法生成的 html，则它是有效的状态(其中 XX 是属性名称(

<span class="field-validation-valid" data-valmsg-for="XX" data-valmsg-replace="true"></span>

以及无效状态

<span class="field-validation-error" data-valmsg-for="XX" data-valmsg-replace="true">
    <span for="Name" generated="true" class="">The XX field is required.</span>
</span>

在扩展方法中，不会生成jquery.validate.js和jquery.validate.unobtrusive.js用于客户端验证的必要data-*属性。你的也不应该。而是使用内置方法并使用方法重载添加其他属性。

public static MvcHtmlString ValidateionUseridTooltipFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression)
{
    var attributes = new { @class = "tooltip fade top in", role = "tooltip" };
    MvcHtmlString validation = ValidationExtensions.ValidationMessageFor(helper,expression, null, attributes);
   return validation;
   // or if you want to enclose this in the div
   TagBuilder div = new TagBuilder("div");
   div.Attributes.Add(....);
   div.InnerHtml = validation.ToString();
   return validation; 
}

请注意，您尚未显示预期的输出，因此不清楚要应用于哪些元素的属性，因此需要调整上述代码以满足您的需求。

另请注意，上面 html 中的内部 <span> 元素是由验证插件文件添加的，除非您修改文件，否则您无法控制它。

此外，您不应该添加 id 属性(重复的id属性是无效的 html(，并且添加一系列类名和添加内联style属性是不必要的和不好的做法(您应该添加另一个类名并为其创建 css 或修改现有的 css 文件(

最后，如果您想了解ValidationMessageFor()方法的工作原理，可以在此处检查源代码。

相关文章：