commit, reset and clear

There are three form methods which are important to understand, the commit, reset and clear methods.

A form view/field in ludojs stores three values:

1) Default value defined by the view 1) Committed Value 3) Current Value

Consider this example:

var view = new ludo.View({
    form:{
        submit:{
            url:'save.html',
            listeners:{
                success:function(json, form){
                    form.commit();
                }
            }
        }
    },
    children:[
        { type:"form.Number", id:"age", name:"age", placeholder:"Age", value:25 },
    ]
})

where we only have one form field, a numeric field "age" with a default value of 25.

When rendered, default, commited and current value will all be 25.

If the user updates the age to 30 from the GUI, current value will be 30 while commited and default value is still 25.

The commit method

A call to commit will update commited value with current value. Thus, default value will be 25, while commited and current value will be 30. This is typically done after a successful form submission if the form should remain visible.

In the example above, this has been implemented with the submit.success listener.

You can also call commit manually using

view.getForm().commit();

The reset method

The reset method on the other hand will reset current value back to commited value. Let's say you have a ludo.form.ResetButton. The user has updated the age to 30 from the GUI, clicked submit, and after a successful submission, the form has been commited.

She then updates the age field again to 35 and clicks Reset. The ludo.form.ResetButton will call the reset method of the form.

view.getForm().reset();

which will change the age value back to 30 which is last commited value.

The clear method

The clear method is similar to reset, except that it reset current and commited value back to it's default. In the example above, a call to reset will always change the value of age back to 25.

If the form field doesn't have a default value, a call to clear will give the field a blank value. Example: clear the firstname field.

The commit, reset and clear methods are available from the form as shown above. This will update all form fields. They are also available on the individual form fields if you want to commmit, reset or clear individual fields.

$('age').commit();