jquery - observablearray - Obteniendo un error no capturado "NO_MODIFICATION_ALLOWED_ERR" para el enlace de entrada

knockoutjs com observablearray

Question

Comienzo con esto:

<script src="/Scripts/jquery-1.6.2.min.js" ...
<script src="/Scripts/knockout-1.2.1.debug.js" ...
<script src="/Scripts/knockout.mapping-latest.js" ...
<script src="/Scripts/jquery.unobtrusive-knockout.min.js" ...

Luego, extraigo un objeto JSON plano del servidor y ato cada propiedad encontrada a elementos coincidentes en el DOM:

$.ajax({
    url: ''/GetRecord'',
    type: ''POST'',
    dataType: ''json'',
    data: JSON.stringify(requestObject),
    contentType: ''application/json; charset=utf-8'',
    success: function (data) {
        // Clear the current view model
        VM.Items.length = 0;

        // only one item coming from server
        VM.Items[0] = ko.mapping.fromJS(data.BlankItem);

        // for each property found, bind it to the matching DOM element
        $.each(VM.Items[0], function (indexInArray, valueOfElement) {
            var attrName = indexInArray;

            // skip over things not an accessor (get/set property function)
            if( typeof valueOfElement == "function")
            {
                var attrValue = valueOfElement();

                // if it''s a checkbox, bind the checked attribute
                var a = $(''input[name="'' + attrName + ''"][type="checkbox"]'');
                if (a.length)
                    a.dataBind({ checked: attrName });

                // if it''s a radio, bind all the found radio checked attributes
                var b = $(''input[name^="'' + attrName + ''"][type="radio"]'');
                if (b.length)
                    b.dataBind({ checked: attrName });

                // if it''s a text, bind the text attribute
                var c = $(''input[name="'' + attrName + ''"][type="text"]'');
                if (c.length)
                    c.dataBind({ text: attrName });  // <--- Error (use value)
            }
        });

        // Then set knockout loose
        ko.applyBindings( VM.Items[0] );
    }
});

Resulta en un error:

Error no detectado: NO_MODIFICATION_ALLOWED_ERR: DOM Exception 7
ko.bindingHandlers.updateknockout-1.2.1.debug.js: 1577
invokeBindingHandlerknockout-1.2.1.debug.js: 1231
ko.applyBindingsToNode.ko.dependentObservable.
disposeWhenNodeIsRemovedknockout-1.2.1.debug.js: 1268
evaluateknockout-1.2.1.debug.js: 927
ko.dependentObservableknockout-1.2.1.debug.js: 965
ko.applyBindingsToNodeknockout-1.2.1.debug.js: 1252
ko.applyBindingsknockout-1.2.1.debug.js: 1284
ko.utils.arrayForEachknockout-1.2.1.debug.js: 48
ko.applyBindingsknockout-1.2.1.debug.js: 1283
$ .ajax.successPropertyForm: 266
f.extend._Deferred.e.resolveWithjquery-1.6.2.min.js: 16
wjquery-1.6.2.min.js: 18
f.support.ajax.f.ajaxTransport.send.d

No veo vinculante ningún elemento que no debería ser. Además, no hay enlaces declarativos knockout en el html. ¿Qué estoy haciendo mal?

Answer 1

DIOS MIO. La respuesta fue usar el atributo de enlace correcto. En lugar de text , ¡fue value para una entrada!

Answer 2

En mi caso, el problema fue que me enlace de datos al texto en lugar de al valor.

bad: <input type = "text" data-bind = "text: id" maxlength = "3" style = "width: 100%;" />

bien: <input type = "text" data-bind = "value: id" maxlength = "3" style = "width: 100%;" />

Answer 3

También vi este error en Chrome cuando accidentalmente llamaba a ko.applyBindings(viewModel) varias veces.