ravipatel
ravipatel

Reputation: 93

How To Add A Link Element Along With Validation Message IF Validation Fails in mvc views

I have requirement if the email field validation like email is already in use that time it show a validation message email is already taken now along with this validation message I want To Attach a Login Link How Can I do that

<div>
  <input asp-for="Email" type="text" placeholder="Email" class="form-control" />
 </div>
<span asp-validation-for="Email" id="err" class="text-danger"></span>
<a  asp-area="" asp-controller="Account" asp-action="Login" asp-route-aname="indiaRegion">login</a>
Any Help That Grate For Me How Can I append The Link At Time Of email Validation Fail  I have Remote Email Verification For Already In Use 

Upvotes: 2

Views: 203

Answers (2)

Pete
Pete

Reputation: 58452

I found I could convert the error message to a string and then do a replace on it:

var error = Html.ValidationMessage("email")?.ToHtmlString();

if (!string.IsNullOrWhiteSpace(error))
{
    error = error.Replace("[login link]", "<a href=\"/login\">login</a>")

    @Html.Raw(error)
}

Upvotes: 0

Zhi Lv
Zhi Lv

Reputation: 21526

Try to use Remote validation and add a <a> tag in the validation message. Check the following code:

UserViewModel:

    [Remote(action: "VerifyEmail", controller: "Home")]
    public string Email { get; set; }

Code in the view:

        <div class="form-group">
            <label asp-for="Email" class="control-label"></label>
            <input asp-for="Email" class="form-control" />
            <span asp-validation-for="Email" class="text-danger"></span> 
        </div> 

Code in the Controller:

    [AcceptVerbs("GET", "POST")]
    public IActionResult VerifyEmail(string email)
    { 
        //Generate the login url:
        string loginurl = string.Format("{0}://{1}/{2}", Request.Scheme, Request.Host, "Identity/Account/Login");
        if (_userService.VerifyEmail(email))
        {
            return Json($"Email {email} is already in use, click the <a href='" + loginurl + "'> here </a> to login.");
        }

        return Json(true);
    }

The test screenshot:

enter image description here

Upvotes: 1

Related Questions