La función de Javascript en la vista parcial no puede acceder a la variable de Javascript definida en la página (MVC 3)

Estoy tratando de aprender a usar Knockoutjs pero tengo un problema

este es el escenario:

Tengo una página donde defino un modelo de vista Knockoutjs de la siguiente manera

$(document).ready(function () {
    var viewModel = {
        selectedColumns: ko.observableArray()
    };
    ko.applyBindings(viewModel);
});

Ahora, con una solicitud de Ajax, agrego a la página una casilla de verificación que quiero vincular al modelo de vista

<input type='checkbox' id='someId' data-bind='attr: { value: 'someValue' }, checked: $root.selectedColumns'>

 $(document).ready(function() {
                 ko.applyBindings(viewModel, document.getElementById(someId));
            });

pero siempre consigo

Error: ReferenceError: viewModel no está definido Archivo de origen: http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js

Creé una página de prueba donde todo está en una página y funciona

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Home Page</title>
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
    <script src="../../Scripts/knockout-2.1.0.debug.js" type="text/javascript"></script>
    <script type="text/javascript">
        var count = 0;
        var viewModel = {
            selectedPeople: ko.observableArray()
        };

        $(document).ready(function () {
            ko.applyBindings(viewModel);
        });

        function AddAnotherCheckbox(){

            var id = "checkbox" + count;

            var checknox = count + "   <input type='checkbox' id='" + id + "' data-bind='attr: { value: \"" + count + "\" }, checked: $root.selectedPeople'><br/>";

            $("#container").append(checknox);
            count++;

             $(document).ready(function() {
                 ko.applyBindings(viewModel, document.getElementById(id));
            });
        }
    </script>
</head>
    <body>

        <input type="button" onclick="AddAnotherCheckbox()"/>

        <div id="container"></div>
        <br/>
        <br/>
        <br/>
        <span data-bind="text: selectedPeople"></span> 
    </body>
</html>

Pero no puedo hacer que funcione usando vista parcial

¿Podría explicarme cuál es el problema y cómo puedo solucionarlo?

gracias

preguntado el 27 de julio de 12 a las 20:07

Un montón de cosas aquí. Si PersonaSeleccionada es una matriz, ¿qué esperaría que mostrara data-bind="text: PersonaSeleccionada"? ¿Por qué lo trata como un booleano en otro lugar: "marcado: $ root.selectedPeople"? ¿Qué estás tratando de lograr? -

1 Respuestas

Descripción

No se trata de Knockout, se trata de JavaScript en general. Su código de prueba funciona porque ha definido el viewModel fuera de $(document).ready

Este es otro alcance.

Compare estos con jsFiddles

Muestra

Esto no funciona

$(document).ready(function () {
    var viewModel = {
        someThing : "Test"
    };
});

$(document).ready(function () {  
    alert(viewModel.someThing);
});

Esto funcionará

var viewModel;
$(document).ready(function () {
    viewModel = {
        someThing : "Test"
    };
});

$(document).ready(function () {   
    alert(viewModel.someThing);
});

Más Información

Respondido el 20 de junio de 20 a las 10:06

Eres el rey de la selva!! :) Gracias - gigapr

¡Encantado de ayudar! ¡¡Que tenga un lindo día!! - loco

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.