[Klasa JS] Walidator Opcje

[ShaXbee]

Klasa wymaga frameworku Prototype.

Na potrzeby projektu próbuję stworzyć tandem walidatorów - jeden po stronie serwera w php, drugi po stronie klienta w JS 'podpinany' o ile to tylko możliwe.

Deklaracja pól do walidacji i sposobu ich sprawdzania ma się znajdować jedynie po stronie serwera, do klienta wysyłana jako doklejony kod JSON.

Klasa będzie oczywiście rozwijana, to co w tej chwili prezentuję można potraktować jako pre-alpha (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Sposób użycia w kodzie HTML:

[HTML] pobierz, plaintext 
<ul id="MyFormErrors">
</ul>
 
<form id="MyForm">
 <input name="field1" />
 <input name="field2" />
</form>
 
<script language="javascript">
new Validator('MyForm', 'MyFormErrors', {
 field1: {
  errorMsg: 'Podaj prawidłową wartość liczbową (10-100)',
  validator:
   name: 'checkInt',
   params: {
    min: 10,
    max: 60
   }
  }
 },
 field2: {
  errorMsg: 'Podaj prawidlowy kod pocztowy',
  validator: {
   name: 'preg',
   params: {
    regexp: /^[0-9]{2}-[0-9]{3}$/
   }
  }
 }
});
</script>
[HTML] pobierz, plaintext 

Kod klasy Validator:

Kod

Validator = Class.create();

Validator.prototype = {

    initialize: function(form, errors, fields) {

        this.form = $(form);
        this.errors = $(errors);

        this.fields = fields;

        $H(fields).each(function(field) {

            this.attach(field.key);
            field.value.error = null;

        }.bind(this));

    },

    attach: function(name, event) {

        node = this.form.firstChild;
        while(node) {

            if(node.name == name)
                Event.observe(node, 'change', this.validate.bind(this), true);

            node = node.nextSibling;

        }

    },

    validate: function(e) {

        obj = Event.element(e);
        field = this.fields[obj.name];

        if(!this[field.validator.name](obj.value, field.validator.params)) {

            if(field.error == null) {

                obj.addClassName('error');

                li = document.createElement('li');
                li.appendChild(document.createTextNode(field.errorMsg));

                this.errors.appendChild(li);

                field.error = li;

            }

        } else if(field.error != null) {

            obj.removeClassName('error');

            field.error.parentNode.removeChild(field.error);
            field.error = null;

        }

        return true;

    },

    preg: function(field, data) {

        return (field.match(data.regexp) != null);

    },

    checkInt: function(field, data) {

        return (!isNaN(parseInt(field)) && (data.min != undefined || field >= data.min) && (data.max != undefined || field <= data.max));

    },

    checkFloat: function(field, data) {

        return (!isNaN(parseInt(field)) && (data.min != undefined || field >= data.min) && (data.max != undefined || field <= data.max));

    }

}

[nospor]

PS2. Skrypt przestał działać IE ale to tylko sprawa czasu

a pod operą testowales?

JavaScript - http://shaxbee.superhost.pl/demo/admin.htm...&field2=asd
Inline script thread
Error:
name: TypeError
message: Statement on line 13: Type mismatch (usually a non-object value used where an object is required)
Backtrace:
Line 13 of linked script http://shaxbee.superhost.pl/demo/Common/JS...idator.class.js
this.attach(field);
Line 71 of linked script http://shaxbee.superhost.pl/demo/Common/JS/prototype.js
return __method.apply(object, args.concat($A(arguments)));
Line 299 of linked script http://shaxbee.superhost.pl/demo/Common/JS/prototype.js
iterator(value, index++);
Line 584 of linked script http://shaxbee.superhost.pl/demo/Common/JS/prototype.js
iterator(pair);
Line 303 of linked script http://shaxbee.superhost.pl/demo/Common/JS/prototype.js
this._each((function (value)
{
try
{
iterator(value, index++);
}
catch (e)
{
if (e != $continue)
throw e;
}
}
));
Line 16 of linked script http://shaxbee.superhost.pl/demo/Common/JS...idator.class.js
this.fields.each((function (field)
{
this.attach(field);
field.value.error = null;
}
).bind(this));
Line 23 of linked script http://shaxbee.superhost.pl/demo/Common/JS/prototype.js
this.initialize.apply(this, arguments);
Line 11 of inline#1 script in http://shaxbee.superhost.pl/demo/admin.htm...&field2=asd
validator = new Validator("testForm", {field1 : {errorMsg : "Nieprawidlowy kod pocztowy", validator : {name : "preg", params : {regexp : /^[0-9]{2}-[0-9]{3}$/}}}, field2 : {errorMsg : "Trinity said: You are NOT handy", validator : {name : "preg", params : {regexp : /^keymaker$/}}}});

i klops. Opera 9.02