C# mvc2 client side form validation with xval, prevent post

Question

I'm using xval to use client side validation in my asp.net mvc2 web-application. Despite the errors it's giving when I enter text in a numeric field, it still tries to post the form to the database. The incorrect values are being replaced by 0 and saved to the database. But instead it shouldn't even be possible to try and submit the form. Can anyone help me out here?

I've set the attributes as below:

[Property]
[ShowColumnInCrud(true, label = "FromPriceInCents")]
[Required]
//[Range(1, Int32.MaxValue)]
public virtual Int32 FromPriceInCents{ get; set; }

The controller catching the request looks as below; I'm getting no errors in this part.

[AcceptVerbs(HttpVerbs.Post)]
[Transaction]
[ValidateInput(false)]
public override ActionResult Create()
{
  //some foo happens
}

My view looks like below:

<div class="label"><label for="Price">FromPrice</label></div>
<div class="field">
<%= Html.TextBox("FromPriceInCents")%>
<%= Html.ValidationMessage("product.FromPriceInCents")%></div>

And at the end of the view i have the following rule which in html code generates the correct validation rules

<%= Html.ClientSideValidation<Product>("Product") %>

I hope someone can helps me out with this issue, thanks in advance!

EDIT: 19th April I just found out that there is a normal button with being used instead of an input type="Button" Could this be the issue?

<button class="save" type="submit" name="save"><span>Opslaan</span></button>

Answer 1

Why do you have the Range attribute commented out? With the properties you have specified as long as anything is entered in the textbox it should pass client side validation.

Answer 2

My first and main concern here would be: why is your app saving the values in the database in the first place? While xVal is a good way to make the application user friendly, you still HAVE to do server side validation. If you don't validate your data on the server - you have a masive security hole! Try checking if the ModelState.IsValid in your controller before saving the values.

Now, from what I see you're registering the xVal validation using

<%= Html.ClientSideValidation<Product>("Product") %>

The way it works is it enables client side validation for all controls prefixed with "Product". Your textbox on the other hand has an id of FromPriceInCents

So the solution here would be to do this:

<%= Html.TextBox("FromPriceInCents")%>
<%= Html.ValidationMessage("FromPriceInCents")%>

<%= Html.ClientSideValidation<Product>() %>

UPD3 I updated the post. Fixed the code so that the prefix is not used.

Also, I compiled a working solution that contains a working solution. List, Edit, Create page, string and int properties, and xVal validation.

public class Product
{
    [ScaffoldColumn(false)]
    public int Id { get; set; }

    [Required]
    [Range(1,50)]
    public int PriceInCents { get; set; }

    [Required]
    [StringLength(50)]
    public string Name { get; set; }
}

and on the view

<%= Html.TextBoxFor(model => model.PriceInCents) %>
<%= Html.ValidationMessageFor(model => model.PriceInCents) %>

Here's the download link.. Check it out and tell me if it works http://www.flexlabs.org/download/xValTest

Answer 3

Maybe this could help:

http://stackoverflow.com/questions/1996125/how-to-use-jquery-validation-plugin-with-metadata-and-the-jquery-forms-plugin-wi