Demonstration

<form id="demonstration-form">
    <label for="firstName">Full name *</label>
    <input type="text"
           id="firstName"
           data-validation-required="true"/>
    <label for="email">Email *</label>
    <input type="text"
           id="email"
           data-validation-required="true"
           data-type="email"/>
    <label for="website">Website *</label>
    <input type="text"
           id="website"
           data-type="url"/>
    <label for="message">Message (min 20, maxy 200)</label>
    <textarea name="message"
              id="message"
              cols="17"
              rows="8"
              data-validation-min-length="20"
              data-validation-max-length="200"
              data-validation-trigger="none"></textarea>
</form>

<script type="text/javascript">
    requirejs.config({
        paths: {
            'globalize': '...',
            'cultures': '...'
        }
    });

    define(['js/form'], function(Form) {
        var form = new Form($('#demo-form')),
            data =  form.mapper.getData();

        $('#get-data').on('click', function() {
            if (form.validation.validate()) {
                $('#result').html(print(data));
            }
        });

        $('#set-data').on('click', function() {
            form.mapper.setData({
                fullName: 'Johannes Wachter',
                email: 'johannes@example.com',
                url: 'example.com',
                message: 'ich bin ein berliner'
            });
        });
    });
</script>