Online forms
What's missing, is a common approach to writing questionnaire type applications. That's why I developed doopgovuk.
Doopgovuk
Try out the Child Benefit Demo developed with doop.
Self Assessment Demo which uses radio / button combo's to answer questions:
Getting started
Assuming ruby, rails and nodejs is installed:sudo apt-get install qt4-dev-tools libqt4-dev libqt4-core libqt4-gui xvfb
These are needed to support the headless capybara test suite.
$ rails new govsite
$ cd govsite
$ echo "gem 'doop'" >> Gemfile
$ bundle
$ rails generate doopgovuk demo
$ rails s
Navigate to http://localhost:3000/demo/index
The DSL
When developing a doop application, to get a feel for what's involved, I've outlined some of the steps:
1) Start by defining a YAML structure which lists all the questions to be asked (see here):
page: {
preamble: {
_page: "preamble",
_nav_name: "Preamble",
income_more_than_50000: {
_question: "Do you have an income of more than £50,000 a year ?"
},
do_you_still_want_to_apply: {
_question: "Do you still want to apply for child benefit?"
},
proof_of_id: {
_question: "We need proof of your identity",
_answer: {}
}
},
on_answer "/page/preamble/enrolled_before" do |question,path, params, answer| answer_with( question, { "_summary" => answer } ) end
on_answer "/page/preamble/enrolled_before" do |question,path, params, answer| answer_with( question, { "_summary" => answer } ) enable( "/page/preamble/year_last_applied", answer == "Yes" ) end3) And finally write the .erb to display the questions (see here):
%=question_form doop, res do %>
<%=question "/page/preamble" do |root, answer| %>
<%=question "/page/preamble/income_more_than_50000" do |root,answer| %>
<button name="b_answer" value="Yes">Yes</button><br/>
<button name="b_answer" value="No"></button>
<% end %>
<%=question "/page/preamble/do_you_still_want_to_apply" do |root,answer| %>
<button name="b_answer" value="Yes">Yes, I still want to apply for child benefit</button
<% end %>
<% when_answered "/page/preamble" do %>
<button>Continue and Save</button>
<% end %>
<% end %>
<% end %>
Give it a go...
Links
Child Benefit Demo
Self Assessment Demo
GDS
GOV UK Elements
Hi Mark,
ReplyDeletehope all is well.
Thought I would let you know that before I left they were switching from a binary button approach to radio and button combo approach.
If you see the radio buttons here: http://govuk-elements.herokuapp.com/
I don't know if this helps you at all.
All the best :)
Hi Chris!
ReplyDeleteThanks for the update. I haven't seen the gov.uk elements site before - what a great resource.
I've created a demo which uses radio buttons, though it still needs a bit of work on the css styling:
http://blooming-wave-8670.herokuapp.com/sasdemo/index
The rails erb file supporting the new radio button styling can be found here:
https://github.com/coder36/doop/blob/master/demo/app/views/sasdemo/_quick_check.html.erb
Thanks again Chris.