MooTools add-ons: Elem.fromJSON, Elem.toJSON, Elem.toObject

/* http://mrrena.blogspot.com/2011/03/dom-input-element-understanding.html
Requires MooTools 1.4.5 or higher: http://mootools.net

Provides:
  Element.fromJSON(jsonString);
  Element.toJSON();
  Element.toObject();

Example:
   (Note that "name" attribute MUST be specified on input elements):

    <div id="wrapper">
      <input type="text" name="name" />
      <input type="text" name="pass" />
      <input type="checkbox" name="trueFalse" />
    </div>

    // pre-fill all corresponding form elements inside wrapper with passed JSON string
    $('wrapper').fromJSON({
        "name": "Frank",
        "pass": "5csaU}8&",
        "trueFalse": true
    });

    $('wrapper').toJSON(); // outputs {"name":"Frank","pass":"5csaU}8&","trueFalse":true}
    $('wrapper').toObject(); // same, except as an object rather than a JSON string
*/

var ElementFunctions = {

    /**
     * Method: Element.fromJSON
     *  Gathers all the child elements of the element, and checks to see if
     *  their name matches any of the keys in the passed "jsonObj." If there is
     *  a match, the input's "value" is assigned the value of the matching key.
     *  This method can be used to populate inputs from the server easily in
     *  one simple call.
     *
     * Parameter:
     *  jsonObj (obj || array) - the JSON response object from the server
     *
     * Returns: nothing
     */
    fromJSON: function(jsonObj) {

        var self = this;

        //Process Name/Value
        self.fromJSON.nameValue = function(obj) {
            for (var x in obj) {
                var elements = self.getElements('[name=' + x + ']');
                if (elements.length == 1) {
                    elements[0].set('value', (obj[x]) ? obj[x] : '');
                    // MSIE 7 and 8 compatibility for select boxes. If options do not have a 'value' attribute, this compability layer is required.
                    // That is, if less than version 9 of IE, if a select box, if the value is not already set, and if a value is specified, then...
                    if (Browser.ie && Browser.version < 9 && elements[0].tagName == 'SELECT' && !$isNotNull(elements[0].get('value')) && $isNotNull(obj[x])) {
                        elements[0].selectedIndex = elements[0].getElements('option').get('html').indexOf(obj[x]);//important! we get the html, not the value
                    }
                    if (typeof(elements[0].getAttribute('checked')) !== undefined) {
                        elements[0].checked = (obj[x]) ? true : false;//click checkboxes
                    }
                }
                else if (elements.length > 1) {
                    elements.each(function(item, index, array) {
                        if (item.get('value') == obj[x]) {
                            item.checked = true;
                        }
                    });
                }
            }
        };

        if (typeOf(jsonObj) == 'object') {
            self.fromJSON.nameValue(jsonObj);
        }
    },

    /**
     * Method: Element.toJSON
     *  Wraps the results of calling <toObj> in a JSON-encoded string
     *
     * Returns:
     *  JSON (string) - A JSON "object" containing element values
     */
    toJSON: function() {
        return JSON.encode(this.toObject());
    },

    /**
     * Method: Element.toObject
     *  Gathers values for the input element if it has a "name" attribute along
     *  with any child input elements with a name, placing them in an object.
     *  This object has the following format, with a key/value pair for each
     *  named input element
     *
     *   {
     *       elementName: elementValue
     *   }
     *
     *  Returns:
     *   JSON (string) - An object containing element values
     */
    toObject: function() {

        var collectionObj = {};
        var elArray = this.getElements('input, select, textarea', true);

        if (/(input|select|textarea)/.test(this.get('tag'))) {
            elArray.include(this);
        }
        elArray.each(function(el) {

            var name = el.name;
            if (!name) {
                return '';
            }
            var value = $(el).get('value');
            if (el.type == 'checkbox') {
                value = (value !== false && value !== 'off') ? true : false;
            }

            Array.from(value).each(function(val) {
                collectionObj[name] = val;
            });
        });

        return collectionObj;
    }
};
Element.implement(ElementFunctions);