search

hypothesis / h

Annotate with anyone, anywhere.
https://hypothes.is/
BSD 2-Clause "Simplified" License
2.94k stars 427 forks source link

bootstrap horizontal forms #9

Closed tilgovi closed 12 years ago

tilgovi commented 12 years ago

pull in the bootstrap form styles they have margins in px which needs to change and probably support more IE junk than I want

tilgovi commented 12 years ago

I started some of this, just a teensy bit, but they have .deform classes because I'm not setting a css_style on my forms.

tilgovi commented 12 years ago

That's coming from the python deform_bootstrap forms.

jtremback commented 12 years ago

Kind of wondering about the role of deform... i'm not sure I like the fact that it is generating html. seems like a pretty monolithic all in one solution.

tilgovi commented 12 years ago

We can talk about it. I liked deform because it uses a core (colander/peppercorn) for serializing/de-serializing and validating the form values. We could call colander/peppercorn ourselves on the raw data and work directly with these libraries to keep validation declarative but hand-write each form. I prefer to let a library do it for me, though.

Perhaps you think there's more going on here than there is and it's a little dense.

Check out this file: https://github.com/hypothesis/h/blob/master/h/templates/form.pt. That's the base form template, taken from https://github.com/dnouri/deform_bootstrap and modified to put the errors below the controls.

Deform (and all form libraries) are an attempted to stay DRY. Rather than coding a form in HTML and writing imperative validation logic you have a single form template and you write schemas like these: https://github.com/hypothesis/h/blob/master/h/views.py#L54

I find this quite nice. I've pulled in the form.pt template from deform_bootstrap, but we can also override any other deform widgets by taking/modifying them and putting them in our templates folder. We can also make our own custom widgets. The idea is to have re-usable form components that nicely encapsulates the whole life-cycle of a form.

The reality is that this may not be a form-heavy application with a non-straightforward mapping to standard CRUD database operations so we probably could get by hand-rolling all the forms, but I think if you learn the full picture of how it works you'll find there isn't so much magic and it shouldn't be scary.

Deform is anything but monolithic. It is sugar and templates on top of standalone schema validation and data serialization libraries. The only thing I don't like is that I haven't a seamless solution that brings client-side validation "for free" yet. I don't know if other python form libraries have it, but I could see how reflecting the colander schema out to client-side validation might be possible in the same way the form.pt template uses jquery.form for AJAX submission.

Meanwhile, I'm closing this ticket because it's vague. I have some styles for horizontal forms, but we haven't really exercised them. I'm sure there are holes, but we'll attack them when we see them (once we have horizontal forms somewhere... if we do... ).