@ArthurClemens pointed out in this gitter comment:
https://gitter.im/lhorie/mithril.js?at=55664ba1d21e5ed02ff06e54
that the Classic MVC example is broken:
https://lhorie.github.io/mithril/components.html#classic-mvc
I wanted to show a working jsfiddle with these changes applied, but I couldn't figure out how to get a POST request working. I do, however, have a jsbin that is working, although there are significant changes in the code to allow for GET and POST.
http://jsbin.com/cokesu/2/edit?js,output
A redraw is called for every character entered in the jsbin but AFAICT, not in this PR. I don't know why. It's as though `oninput` is really `onchange`. It's possible to limit the redraw to once when the "save" button is clicked, but this requires a change in logic:
var ContactForm = {
controller: function(args) {
this.contact = m.prop(new Contact())
this.save = function(contact) {
Observable.trigger("saveContact", {contact: contact})
}
},
view: function(ctrl, args) {
var contact = ctrl.contact()
return m("form", [
m("label", "Name"),
m("input[name=name]"),
m("label", "Email"),
m("input[name=email]"),
m("button[type=button]", {onclick: function(){
contact = {
name: m.prop(this.parentNode.elements.name.value),
email: m.prop(this.parentNode.elements.email.value)
}
ctrl.save(contact)
}}, "Save")
])
}
}
These changes make the the text clearer to me. I did not want to change the voice of the text, but I tried to clear out some verbosity and improve consistency. I did my best not to interfere with the logic of the prose.
This document seems written to stand on its own, so I recommend the following changes:
- a general explanation of the args param as in `controller: function(args) {` and `view: function(ctrl, args) { ...` (when first used, well before the signature)
- a specific explanation of {data: args} in m.request() (mithril.request.md could use the same treatment)
- an explanation of the extras param as in `controller: function(args, extras) {` and `view: function(ctrl, args, extras) { ...`
- the term *rollback* should be explained or replaced
- caveat #3/#4: Should *root element* be changed to *top-most element* so as not to be confused with the element the component is mounted on ?
- in testing, explain why the first param to view is `null`
I hope you can find some of this useful.
