2012-02-16 9 views
17

He estado construyendo una página usando ASP.NET MVC 2 usando KnockoutJS, KnockoutJS Mapping plugin ,, y jQuery 1.7.1. Me gustaría poder usar también el complemento de Validación KnockoutJS (encontrado here). Sin embargo, necesito tener validación del lado del servidor y del cliente.Modelos de vista de mapa a KnockoutJS Validación

¿Es posible hacer que mis modelos de vista se asignen al KnockoutJS Validation plugin que usa el método .extend()?

EDITAR: Ejemplo. enciende automáticamente:

[Required] 
public string Firstname { get; set; } 

En esto:

var viewmodel = { 
    firstname: ko.observable().extend({ required: true }); 
} 
+0

¿Está utilizando las anotaciones de datos en sus modelos de C# y utilizando EditorFor para rellenar las reglas de validación del cliente, o le gustaría?Puede usar la misma validación no intrusiva del lado del cliente que ha incorporado MVC que podría usar para formularios de estilo MVC estándar sin demasiado trabajo (al menos en MVC3 con la plantilla de la aplicación de Internet). – kendaleiv

+0

Consulte mis ediciones en el original – Ryan

+0

Este es un enfoque muy intrigante y lo he pensado mucho. He estado pensando en generar código de comportamiento de C# a Javascript. Dicho eso, creo que tendrás que crear algo que refleje el modelo y genere javascript. Tal vez solo la parte de validación y deje que el plugin de mapeo haga lo que hace. La combinación del mapeo y el código de validación generado podría darle lo que necesita. La razón por la que creo que necesita generar el código de validación es porque creo que tendrá dificultades para generar el código de validación usando solo Javascript, pero puedo estar equivocado. –

Respuesta

7

En el Mvc Controls Toolkit implementé un motor que permite la validación de Mvc habitual (anotaciones de datos o lo que sea) en knockout.js.La validación del lado del cliente y del lado del servidor se puede habilitar. Además, el knockout se puede usar con ayuda de Mvc, algunos enlaces se deducen automáticamente, etc.

+0

Sería genial si pudieras comenzar con la forma en que lo implementaste usando MVC Controls Toolkit. Muchas gracias – Ian

0

La validación plugin funciona en la forma en que es necesario extender los observables desee validar.

No importa si se crean a partir de asignaciones, simplemente cree una función que ejecute después de que se haya realizado la actualización y agregue toda la validación que desee.

O, si lo desea, puede usar los enlaces de validación. Lea el archivo Léame en Github para la validación del knockout y verá cómo lo hacen.

+0

Consulte mis ediciones en la pregunta original – Ryan

1

le recomiendo usar el construido en el MVC validación del lado del cliente, puede que tenga que recurrir a ella, intente esto:

$.validator.unobtrusive.parse(yourFormElement) 

Código de: https://stackoverflow.com/a/5669575/941536

No estoy seguro si MVC2 tiene la validación del lado del cliente, aunque discreta , no está seguro si una actualización a MVC3 sería una opción para usted si es necesario.

+4

Esta no es la forma preferida de validar KnockoutJs. No desea validar los elementos del formulario. Desea validar el modelo de vista. –

+2

¿Existe alguna manera fácil de volver a utilizar las Anotaciones de datos o el código .Net de FluentValidator con la validación Knockout y que valide el modelo de vista Knockout? Prefiero evitar crear y mantener dos conjuntos de reglas de validación, pero esto puede ser aún más difícil si el modelo de vista Knockout y el modelo .Net no coinciden o son muy diferentes. – kendaleiv

+0

"Esta no es la forma preferida de validar KnockoutJs". ¿Por qué? La validación se conecta a las entradas del usuario y los elementos de entrada generalmente se asignan a las propiedades del modelo. Mostrar mensajes de error que no estén conectados a un campo de entrada pero a alguna propiedad del modelo que no sea visible para el usuario puede confundir mucho al usuario. –

5

Si está utilizando knockoutjs y jquery, se me ocurrió el siguiente método muy simple para realizar una validación básica del lado del cliente.

Dondequiera que desea mostrar el mensaje de error en su página, incluyen una etiqueta span así:

<span name="validationError" style="color:Red" 
data-bind="visible: yourValidationFunction(FieldNameToValidate())"> 
* Required. 
</span> 

Obviamente se necesita para escribir "yourValidationFunction" para hacer lo que quiere que haga. Solo tiene que devolver verdadero o falso, verdadero significa mostrar el error.

Puede usar jquery para evitar que un usuario proceda si se muestran errores de validación. Es probable que ya tiene un botón de salvar lo que desencadena una función javascript para hacer un poco de ajax o lo que sea, por lo que sólo incluya esta en la parte superior de la misma:

if ($("[name='validationError']:visible").length > 0) { 
     alert('Please correct all errors before continuing.'); 
     return; 
    } 

Esto es mucho más simple y más flexible que muchas otras soluciones de validación fuera ahí. Puede colocar su mensaje de error donde desee, y no necesita aprender a usar alguna biblioteca de validación, y este método funciona independientemente de la tecnología del lado del servidor.

+0

+1 Me gusta la simplicidad de su solución. Actualmente estoy luchando con jQuery valdiate para campos no obligatorios y Knockout y tu respuesta me indicó una nueva dirección. –

Cuestiones relacionadas