Collapsible forms with jQuery
I spent a few hours recently refactoring the TickTickDone javascript to reduce code duplication. In the process, I generalised out a common pattern - a link that, when clicked disappears and is replaced with a form. If the form is cancelled or submitted, the form disappears and the link returns. An example can be found in the “Add a new milestone” button on the goal page of TickTickDone. I’ve packaged up the HTML template and the javascript, and linked them below. To use it, create your HTML page with a section following the format in collapse-form.html. Include collapse-form.js, and call the following in your javascript init:
init_collapse_forms($(document));