radio buttons checked with jquery not holding proper value on post

radio buttons checked with jquery not holding proper value on post



I have an html form, with some radio buttons that are dynamically set with

jquery. This posts back to an asp.net mvc application.

Lets say we have three radio buttons, lets say the value would modelbind

to RadioOption:

Name ID Checked? Disabled? Model Value

Option1 #opt1 ✓ ✗

0

Option2 #opt2 ✗ ✗

1

Option3 #opt3 ✗ ✓

2

and the user picks a separate option which triggers this bit of javascript

code:

$("#opt1").prop("checked", false);

$("#opt1").prop("disabled", true);

$("#opt2").prop("checked", false);

$("#opt2").prop("disabled", true);

$("#opt3").prop("checked", true);

$("#opt3").prop("disabled", true);

which (visibly) shows

Name ID Checked? Disabled? Model Value

Option1 #opt1 ✗ ✓

0

Option2 #opt2 ✗ ✓

1

Option3 #opt3 ✓ ✓

2

So the user won't be able to uncheck opt3

Now, this all looks good on the page, but when I hit the submit button,

and take a look at the Glimpse Model Binding page, the value that comes in

for RadioOption is not 2 like I would expect, but 0 (the original value)

Is there another way to set these radio buttons that will allow me to

receive the right value?