knockout knockout.js validation knockout-validation

knockout.js - Validación Knockout



ko observable() extend (3)

Eche un vistazo a Knockout-Validation que limpia y configura lo que se describe en la documentación de knockout . Debajo: Ejemplo en vivo 1: forzar la entrada para que sea numérica

Puedes verlo en vivo en Fiddle

ACTUALIZACIÓN : el violín se ha actualizado para utilizar el último KO 2.0.3 y ko.validation 1.0.2 utilizando las URL CDN de Cloudfare

Para configurar ko.validation:

ko.validation.rules.pattern.message = ''Invalid.''; ko.validation.configure({ registerExtenders: true, messagesOnModified: true, insertMessages: true, parseInputAttributes: true, messageTemplate: null });

Para configurar las reglas de validación, use los extensores. Por ejemplo:

var viewModel = { firstName: ko.observable().extend({ minLength: 2, maxLength: 10 }), lastName: ko.observable().extend({ required: true }), emailAddress: ko.observable().extend({ // custom message required: { message: ''Please supply your email address.'' } }) };

Tengo el proyecto asp.net mvc3 donde hago una edición masiva en una tabla con un enlace directo. Quiero hacer validaciones como validaciones requeridas y de números mientras guardo datos. ¿Hay alguna manera más fácil de hacer validaciones de eliminación? PD: No estoy usando formularios.


La validación de Knockout.js es útil pero no es robusta. Siempre debe crear una réplica de validación del lado del servidor. En su caso (al usar knockout.js) está enviando datos JSON al servidor y de vuelta de forma asincrónica, de modo que puede hacer que el usuario piense que ve la validación del lado del cliente, pero de hecho sería una validación asíncrona del lado del servidor.

Mire el ejemplo aquí upida.cloudapp.net:8080/org.upida.example.knockout/order/create?clientId=1 Este es un enlace de "Crear orden". Intenta hacer clic en "guardar" y jugar con los productos. Este ejemplo se hace usando la biblioteca upida (hay versión Spring mvc y asp.net mvc de esta biblioteca) de codeplex.


Si no desea usar la biblioteca KnockoutValidation, puede escribir la suya propia. Aquí hay un ejemplo para un campo Obligatorio.

Agregue una clase de JavaScript con todas las extensiones KO o extensores, y agregue lo siguiente:

ko.extenders.required = function (target, overrideMessage) { //add some sub-observables to our observable target.hasError = ko.observable(); target.validationMessage = ko.observable(); //define a function to do validation function validate(newValue) { target.hasError(newValue ? false : true); target.validationMessage(newValue ? "" : overrideMessage || "This field is required"); } //initial validation validate(target()); //validate whenever the value changes target.subscribe(validate); //return the original observable return target; };

Luego, en su viewModel extiéndase observable por:

self.dateOfPayment: ko.observable().extend({ required: "" }),

Hay varios ejemplos en línea para este estilo de validación.