2

I've found that my ValidationMessageFor stopped working after I added a @Name attribute to the TextBoxFor. This makes sence but how do I get the ValidationMessageFor to work with the custom name attribute. I need to maintain the custom name attribute.

<div class="input-group margin-bottom-small">
    <span class="input-group-addon"><i class="fa fa-external-link-square fa-fw"></i>
    </span>
    @Html.TextBoxFor(model => model.SelectedContact.WebSiteInfoes[0].VanityURL, new { @class = "form-control", @placeholder = "Enter Vanity URL", @Name="VanityUrl" })
</div>
@Html.ValidationMessageFor(model => model.SelectedContact.WebSiteInfoes[0].VanityURL)

See related post here

So I made some changes and went back to the modified jquery.validate.js the problem is that the second value never makes it to the Validation method.

Model Field

[DisplayName("Vanity URL")]
[Remote("IsVanityURL_Available", "Validation", AdditionalFields = "ContactId")]
[RegularExpression(@"(\S)+", ErrorMessage = "White space is not allowed.")]
[Editable(true)]               
public string VanityURL { get; set; }

Fiddler Trap of the Request

enter image description here

Params at the Method

enter image description here

Community
  • 1
  • 1
Tim
  • 1,249
  • 5
  • 28
  • 54
  • 1
    Overriding the name attribute means the control will never bind to your model so your model will always be invalid when you post. What are you actually trying to do? –  Mar 25 '15 at 01:44
  • I'm using Remote Validation. I'm trying to avoid changing the jquery.validate.js file to that it will work with names like SelectedContact.WebSiteInfoes[0].VanityURL. I found other posts that had the same problem and that resolved it. I tried it and it did indeed work but now I fond that I have to send additional fields to my validation method. this lead me down the @Name method so both params were passed successfully but now I can't display the message after validation – Tim Mar 25 '15 at 01:48
  • Yes, that was may answer :) Do not attempt to override the name attribute because you can't then bind to your model on post back. If you have any validation attributes, then the model will be invalid and you will be stuck in an endless loop. As I noted in my [answer here](http://stackoverflow.com/questions/27513472/remote-validation-for-list-of-models), its been reported as a bug. In the meantime you will need to modify the jquery.validate.js file. If you have additional fields, you will need to make a similar modification to strip the prefix from those too. –  Mar 25 '15 at 01:57
  • Therein lies the problem. I'm looking at the Fiddler request and I see the values but the second parameter does not get mapped to the validation method. it's always null – Tim Mar 25 '15 at 01:59
  • If you don't want to modify the jquery.validate files, you can always manually get the posted values from `Request.QueryString` (which will include the values for the additional fields. –  Mar 25 '15 at 03:08
  • I thought about going that direction if I can't get this to work. I have no problem with updating the js file. I updated the OP with some additional information. I see everything in the request that's trapped by fiddler it's just not being mapped properly to the method and I don't know why. – Tim Mar 25 '15 at 03:10
  • That because the jquery `remote` method is posting `SelectedContact.WebSiteInfoes[0].ContactId=11`, but you parameter is named `ContactId` (not `SelectedContact.WebSiteInfoes[0].ContactId`) - which is why you would need to modify the file to strip the prefix) –  Mar 25 '15 at 03:19
  • Ok that makes sense, but the file was modified with the code snippet from the other post. data[element.name.substr(element.name.lastIndexOf(".") + 1)] = value; – Tim Mar 25 '15 at 03:20
  • I know (its my code). That code only strips the prefix from the property the `RemoteAttribute` is applied, not from any properties that are defined as `additionalFields` (which is why `VanityUrl` is bound, but `ContactId` is not). Further modifications would be required to the jquery.validate file to make it work, but as I have reported it as a bug, I'll let the experts work out the best solution. –  Mar 25 '15 at 03:27
  • That makes more sense. Do you have any idea where the additionalFields code is in the file? – Tim Mar 25 '15 at 03:29
  • No - took me hours to find the solution for stripping the prefix from the property :) –  Mar 25 '15 at 03:48
  • I'll take a look. I doubt I'll find any different. Will most likely have to wait for a fix. Thanks for your help Stephen! – Tim Mar 25 '15 at 05:42
  • A comment has just been added to my bug issue. Haven't had a chance to check yet, but it may solve the issue for additional fields. –  Mar 26 '15 at 02:32
  • Do you have a link? I'm not seeing any current activity on https://github.com/jzaefferer/jquery-validation/issues?q=is%3Aopen+is%3Aissue+sort%3Aupdated-desc for a related issue. – Tim Mar 26 '15 at 02:42
  • [MVC Remote attribute does not work with complex objects and collections](https://aspnetwebstack.codeplex.com/workitem/2213) –  Mar 26 '15 at 02:46
  • Hey Stephen, Just wanted to update you on what I did. I had a brain fart the other night and questioned why I wasn't using a partial view to by pass the complex object. I just had a chance to get back to the project and test it and ot works perfectly. Although not ideal for all implementations it does solve my problem. – Tim Mar 28 '15 at 02:02

3 Answers3

2

You have to update the data-valmsg-for attribute of ValidationMessageFor helper with the value of the corresponding HTML controller name.

@Html.ValidationMessageFor(model => model.SelectedContact.WebSiteInfoes[0].VanityURL, 
null, new { data_valmsg_for = "VanityUrl" })
Safeer Hussain
  • 1,230
  • 1
  • 15
  • 27
0

You could just append it to @class:

@Html.TextBoxFor(
    model => model.SelectedContact.WebSiteInfoes[0].VanityURL,
    new { @class = "form-control VanityURL", placeholder = "Enter Vanity URL" })

var vanityUrl = $('.VanityURL').first();
beautifulcoder
  • 10,832
  • 3
  • 19
  • 29
0

I had a brain fart the other night and questioned why I wasn't using a partial view to bypass the complex object problem. I just had a chance to get back to the project and test it and it works perfectly with no changes needed to jquery.validate.js or jquery.validate.unobtrusive.js. Although it may not resolve this problem for all implementations it does solve mine.

Tim
  • 1,249
  • 5
  • 28
  • 54