Last active
August 29, 2015 14:22
-
-
Save Mausglov/eefa52e298acea36cbef to your computer and use it in GitHub Desktop.
Попытка применить Матрешку
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
сервер генерирует форму. Часть полей - обязательны. Обязательные поля имеют css-класс required. | |
На текущий момент проверка на валидность - это "длина значения больше нуля?" либо проверка на ненулевое значение | |
Если поле невалидно, то на него навешивается css-класс error | |
валидация происходит либо при отправке формы (для всех полей), либо при изменении содержимого поля (с дебаунсом) | |
*/ | |
var Field = Class({ | |
'extends': MK.Object, | |
validate: function() { | |
return true; | |
}, | |
constructor: function( selector ) { | |
this.bindNode("val", selector); | |
} | |
}); | |
var FieldRequired = Class({ | |
'extends': Field, | |
validate: function() { | |
var v = $.trim(this.val); | |
var i = parseInt(v, 10); | |
var $node = $( this.bound("val")); | |
var result; | |
if ( isNaN(i) ) { | |
result = (v.length > 0); | |
} else { | |
result = ( i != 0); | |
} | |
$node.toggleClass("error", !result); | |
return result; | |
}, | |
constructor: function() { | |
Field.prototype.constructor.apply( this, arguments ); | |
this.onDebounce( 'change:val', function() { | |
this.validate(); | |
}, 300 ); | |
} | |
}); | |
var FormOrder = Class({ | |
'extends': MK.Object, | |
fields: [], | |
validate: function() { | |
var result = true; | |
var f; | |
for( var i = 0; i < this.fields.length; i++ ) { | |
f = this.fields[i]; | |
if ( !f.validate() ) result = false; | |
} | |
return result; | |
}, | |
send: function() { | |
// тут будет отправка формы | |
}, | |
constructor: function( selector ) { | |
var self = this | |
.bindNode({sandbox: selector}) | |
.on( 'submit::sandbox', function(evt) { | |
if ( this.validate() ) { | |
this.send(); | |
} | |
evt.preventDefault(); | |
}) | |
; | |
this.selectAll("input, select, textarea").each( function(){ | |
if ( this.type == "submit" ) { | |
// do nothing | |
} else { | |
var $item = $(this); | |
if ( $item.hasClass("required") ) { | |
self.fields.push( new FieldRequired( this ) ) | |
} else { | |
self.fields.push( new Field( this ) ) | |
} | |
} | |
}); | |
} | |
}); | |
var myform = new FormOrder("#form-order"); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
подход был неверный. Написал себе (разбор работы bindNode)[https://gist.github.com/Mausglov/b3ad57689332f10a2db9]