(validate) number() with radiobuttons and selects containing empty values

(validate) number() with radiobuttons and selects containing empty values

Hello,

I'm using ASP.NET MVC3 with unobtrusive validation that utilizes the validate plugin. What I'm trying to achieve is to bind a (nullable) numeric property of my model to a group of radiobuttons or a dropdown. The problem here is, that "nothing selected" should be the first option in the list (the value of the input:radio or option is "").

First thing is: MVC3 automatically generates validation metadata for all numeric fields that points to the number validator on the client, that means, in the case of radiobuttons, that the first element (with the value of "") will have a number validator attached to it.

Now, as soon as the form validates, the radiobutton or dropdownlist will get a validation error ("must be a number") - though an empty input:text works perfectly fine.

I went through the validation code with firebug to see what happens. I put down some notes while tracking the calls (if these are too obscure, please let me know):

validation calls number(element, value: "")
number calls optional(element)
optional calls !required(value: "", element, param: undefined)
required call to !depend(param: undefined, element) returns true
!depend:true becomes false back in required

it's here that the validation starts to behave differently:

INPUT RADIO:
required calls checkable(element) returns true
required calls getLength(value: "", element) returns 1
getLength > 0 becomes true back in required
required returns true
!required:true becomes false back in optional
optional returns false && "dependency-mismatch" ==> false
number returns false => "The field must be a number."

INPUT TEXT
required calls checkable(element) returns false
required returns $.trim(value).length > 0 ==> false
!required:false ==> true back in optional
optional returns true && "dependency-mismatch" ==> "dependency-mismatch"
number returns "dependency-mismatch" => no error

From what I see, optional will always return false for checkable elements with one element checked or selected. Then, when the value of the first radiobutton or the selected value of the dropdown is an empty string, the number validation regular expression will fail.
I don't really understand the interaction between optional and required and what "dependecy-mismatch" actually means.
I don't know if it's a bug or intended behaviour that required evaluates the value of the element only if the element is not selectable or checkable and so does not return the same dependency-mismatch as with an empty text input.

Now I came up with a few solutions that could cirumvent the problem, but they all have their problems:
  • Make the properties in my server side model non-numeric (strings), but this cripples the flexibility of the models.
  • Don't use empty values in radiobuttons or selects with numeric values, but some unused number (i.e. -1) and use range for required fields and remap -1 to null in the controller for non-required fields, but this is not very elegant and prone to errors.
  • Overwrite the number method of the validator so, that emtpy values return true (or "dependency-mismatch", to keep consistency). But I'm not sure I dare since I don't know if this has side-effects.

Or maybe I'm getting something totally wrong and there is a very simple solution to this?

Regards,
Tom