Is special setup required to get Knockout to work with MVC model binding?

Question

I saw this question about KO binding and MVC and it has me concerned. The question is long and I don't know if it applies to what I am trying to do.

I have an input:

<input 
    id="Item_ReqestedItem_ItemNumber" 
    type="text" value="" name="Item.ReqestedItem.ItemNumber" 
    data-bind="value: ItemNumberItem, disable: ItemNumberItem.isServerSet" 
    disabled="">

If I manually type a value into this field and POST, the value is passed to the Controller/Action. If I let KO populate this data then the value at POST shows null.

What is the minimum work required to get this value to POST when I use Knockout values?

I am not using ko.editable. Do I need it?
I am not doing anything to support this relationship between MVC and KO in document ready. Do I need to in order to accomplish this simple task?

Update

The comments are correct. It is the disable attribute that is causing the value to be null. The easy fix is to use readonly. I still do not have a fix for this issue. Getting rid of disabled is not an option. I do not see how I can switch to readonly without tossing out the KO framework. How can I get the disabled data back to the server? I'd prefer to fix this with KO as I have to manage about 30 inputs.

When is `ItemNumberItem.isServerSet` true? Is it when you let "KO populate this data"? — GôTô, May 16 '14 at 21:21
No? Ok, I thought it was because some browsers do no send values when disabled — GôTô, May 16 '14 at 21:26
The `value` binding of knockout will change the value of the input it's bound to. So, as long as the input has a name which the model binder can map to your model, changing ItemNumberItem via knockout wont be any different from chaning it manually. My guess would also be that isServerSet is true when submitting. What if you compare the two POST requests? — sroes, May 16 '14 at 22:44
@GôTô - You guys both saved me a ton of trouble heading down the wrong path. If you want to post an answer I'd like to give you guys both some credit. The last part of the problem was very easy to solve compared to what you two did. — P.Brian.Mackey, May 16 '14 at 23:51

score 1 · Accepted Answer · edited May 23 '17 at 12:05

The disabled attribute will prevent the data of your input to be submitted.

You want to use the readonly attribute instead.

You can check this thread: What's the difference between disabled=“disabled” and readonly=“readonly” for HTML form input fields?:

a readonly element is just not editable, but gets sent when the according form submits. a disabled element isn't editable and isn't sent on submit

P.Brian.Mackey · Answer 2 · 2014-05-17T00:00:32.180

No special setup is required to get KO to work with MVC. The comments were correct in that the disabled attribute caused the data not to POST. I'm adding a binding handler to support readonly in KO. Readonly should POST. Fiddle

  ko.bindingHandlers.readOnly = {
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        if (value) {
            element.setAttribute("readOnly", true); 
        }  else {
            element.removeAttribute("readOnly");
        }  
    }  
}

var viewModel = {
    text: ko.observable("test"),
    locked: ko.observable(false)
};


ko.applyBindings(viewModel);

Is special setup required to get Knockout to work with MVC model binding?

2 Answers2