Extend questionnaire docs
This commit is contained in:
parent
6df66dca08
commit
898eab0880
2 changed files with 317 additions and 2 deletions
|
|
@ -140,6 +140,302 @@
|
|||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>What are your favorite brands?</legend>
|
||||
<ol>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-brands" for=group-brands-branda>
|
||||
<input class=form-check-input type=checkbox name=group-brands
|
||||
value=brand-a id=group-brands-branda> Brand A</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-brands" for=group-brands-brandb>
|
||||
<input class=form-check-input type=checkbox name=group-brands
|
||||
value=brand-b id=group-brands-brandb> Brand B</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-brands" for=group-brands-brandc>
|
||||
<input class=form-check-input type=checkbox name=group-brands
|
||||
value=brand-c id=group-brands-brandc> Brand C</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-brands" for=group-brands-none>
|
||||
<input class=form-check-input type=checkbox name=group-brands
|
||||
value=none id=group-brands-none> None</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CTRL -->
|
||||
<div class=mb-3>
|
||||
<label class="form-label group-brands" for=group-brands-other>Other</label>
|
||||
<input class=form-control id=group-brands-other type=text
|
||||
name=group-brands>
|
||||
</div>
|
||||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>How often do you shop online?</legend>
|
||||
<ol>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-shopping"
|
||||
for=group-shopping-daily>
|
||||
<input class=form-check-input type=radio name=group-shopping
|
||||
value=daily id=group-shopping-daily> Daily</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-shopping"
|
||||
for=group-shopping-weekly>
|
||||
<input class=form-check-input type=radio name=group-shopping
|
||||
value=weekly id=group-shopping-weekly> Weekly</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-shopping"
|
||||
for=group-shopping-monthly>
|
||||
<input class=form-check-input type=radio name=group-shopping
|
||||
value=monthly id=group-shopping-monthly> Monthly</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-shopping"
|
||||
for=group-shopping-rarely>
|
||||
<input class=form-check-input type=radio name=group-shopping
|
||||
value=rarely id=group-shopping-rarely> Rarely</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-shopping"
|
||||
for=group-shopping-never>
|
||||
<input class=form-check-input type=radio name=group-shopping
|
||||
value=never id=group-shopping-never> Never</label>
|
||||
</div>
|
||||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Which of the following devices do you own?</legend>
|
||||
<ol>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-devices"
|
||||
for=group-devices-smartphone>
|
||||
<input class=form-check-input type=checkbox name=group-devices
|
||||
value=smartphone id=group-devices-smartphone> Smartphone</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-devices"
|
||||
for=group-devices-laptoppc>
|
||||
<input class=form-check-input type=checkbox name=group-devices
|
||||
value=laptop/pc id=group-devices-laptoppc> Laptop/PC</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-devices"
|
||||
for=group-devices-tablet>
|
||||
<input class=form-check-input type=checkbox name=group-devices
|
||||
value=tablet id=group-devices-tablet> Tablet</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-devices"
|
||||
for=group-devices-smartwatch>
|
||||
<input class=form-check-input type=checkbox name=group-devices
|
||||
value=smartwatch id=group-devices-smartwatch> Smartwatch</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-devices" for=group-devices-none>
|
||||
<input class=form-check-input type=checkbox name=group-devices
|
||||
value=none id=group-devices-none> None</label>
|
||||
</div>
|
||||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>What is your preferred method of payment for online purchases?</legend>
|
||||
<ol>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-payment"
|
||||
for=group-payment-creditdebitcard>
|
||||
<input class=form-check-input type=radio name=group-payment
|
||||
value=credit/debit-card id=group-payment-creditdebitcard> Credit/Debit Card</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-payment"
|
||||
for=group-payment-paypal>
|
||||
<input class=form-check-input type=radio name=group-payment
|
||||
value=paypal id=group-payment-paypal> PayPal</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-payment"
|
||||
for=group-payment-banktransfer>
|
||||
<input class=form-check-input type=radio name=group-payment
|
||||
value=bank-transfer id=group-payment-banktransfer> Bank Transfer</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-payment"
|
||||
for=group-payment-cashondelivery>
|
||||
<input class=form-check-input type=radio name=group-payment
|
||||
value=cash-on-delivery id=group-payment-cashondelivery> Cash on Delivery</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-payment"
|
||||
for=group-payment-cryptocurrency>
|
||||
<input class=form-check-input type=radio name=group-payment
|
||||
value=cryptocurrency id=group-payment-cryptocurrency> Cryptocurrency</label>
|
||||
</div>
|
||||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Which social media platforms do you use regularly?</legend>
|
||||
<ol>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-socialmedia"
|
||||
for=group-socialmedia-facebook>
|
||||
<input class=form-check-input type=checkbox name=group-socialmedia
|
||||
value=facebook id=group-socialmedia-facebook> Facebook</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-socialmedia"
|
||||
for=group-socialmedia-twitter>
|
||||
<input class=form-check-input type=checkbox name=group-socialmedia
|
||||
value=twitter id=group-socialmedia-twitter> Twitter</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-socialmedia"
|
||||
for=group-socialmedia-instagram>
|
||||
<input class=form-check-input type=checkbox name=group-socialmedia
|
||||
value=instagram id=group-socialmedia-instagram> Instagram</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-socialmedia"
|
||||
for=group-socialmedia-linkedin>
|
||||
<input class=form-check-input type=checkbox name=group-socialmedia
|
||||
value=linkedin id=group-socialmedia-linkedin> LinkedIn</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-socialmedia"
|
||||
for=group-socialmedia-tiktok>
|
||||
<input class=form-check-input type=checkbox name=group-socialmedia
|
||||
value=tiktok id=group-socialmedia-tiktok> TikTok</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-socialmedia"
|
||||
for=group-socialmedia-none>
|
||||
<input class=form-check-input type=checkbox name=group-socialmedia
|
||||
value=none id=group-socialmedia-none> None</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CTRL -->
|
||||
<div class=mb-3>
|
||||
<label class="form-label group-socialmedia"
|
||||
for=group-socialmedia-other>Other</label>
|
||||
<input class=form-control id=group-socialmedia-other type=text
|
||||
name=group-socialmedia>
|
||||
</div>
|
||||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>How do you usually consume news?</legend>
|
||||
<ol>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-newsconsumption"
|
||||
for=group-newsconsumption-onlinenewswebsites>
|
||||
<input class=form-check-input type=radio name=group-newsconsumption
|
||||
value=online-news-websites
|
||||
id=group-newsconsumption-onlinenewswebsites> Online News Websites</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-newsconsumption"
|
||||
for=group-newsconsumption-socialmedia>
|
||||
<input class=form-check-input type=radio name=group-newsconsumption
|
||||
value=social-media id=group-newsconsumption-socialmedia> Social Media</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-newsconsumption"
|
||||
for=group-newsconsumption-television>
|
||||
<input class=form-check-input type=radio name=group-newsconsumption
|
||||
value=television id=group-newsconsumption-television> Television</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-newsconsumption"
|
||||
for=group-newsconsumption-newspapersmagazines>
|
||||
<input class=form-check-input type=radio name=group-newsconsumption
|
||||
value=newspapers/magazines
|
||||
id=group-newsconsumption-newspapersmagazines> Newspapers/Magazines</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-newsconsumption"
|
||||
for=group-newsconsumption-radio>
|
||||
<input class=form-check-input type=radio name=group-newsconsumption
|
||||
value=radio id=group-newsconsumption-radio> Radio</label>
|
||||
</div>
|
||||
<li>
|
||||
<!-- FORM/CHECKABLE -->
|
||||
<div class=form-check>
|
||||
<label class="form-check-label group-newsconsumption"
|
||||
for=group-newsconsumption-none>
|
||||
<input class=form-check-input type=radio name=group-newsconsumption
|
||||
value=none id=group-newsconsumption-none> None</label>
|
||||
</div>
|
||||
</ol>
|
||||
<hr class=my-4>
|
||||
</fieldset>
|
||||
<button class="btn btn-primary" type=submit>Submit</button>
|
||||
</form>
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
#+title: Creating a Questionnaire using cl-sbt/questionnaire Macros in a Web Application
|
||||
#+author: Marcus Kammer
|
||||
#+email: marcus.kammer@mailbox.org
|
||||
#+date: 2024-01-27T14:40+01:00
|
||||
#+date: 2024-01-28T11:38+01:00
|
||||
* Introduction
|
||||
|
||||
Questionnaires are powerful tools for gathering information and insights from
|
||||
|
|
@ -51,7 +51,26 @@ required for different types of questions in a questionnaire.
|
|||
:choices (:radio "Male" "Female" "Non-binary" "Prefer not to say" "Other" :text "Other"))
|
||||
(:ask "How many hours per day, on average, do you spend browsing the internet?"
|
||||
:group "webbrowsing"
|
||||
:choices (:radio "Less than 1 hour" "1-3 hours" "3-5 hours" "5+ hours"))))))
|
||||
:choices (:radio "Less than 1 hour" "1-3 hours" "3-5 hours" "5+ hours"))
|
||||
;; Additional Questions
|
||||
(:ask "What are your favorite brands?"
|
||||
:group "brands"
|
||||
:choices (:checkbox "Brand A" "Brand B" "Brand C" "None" :text "Other"))
|
||||
(:ask "How often do you shop online?"
|
||||
:group "shopping"
|
||||
:choices (:radio "Daily" "Weekly" "Monthly" "Rarely" "Never"))
|
||||
(:ask "Which of the following devices do you own?"
|
||||
:group "devices"
|
||||
:choices (:checkbox "Smartphone" "Laptop/PC" "Tablet" "Smartwatch" "None"))
|
||||
(:ask "What is your preferred method of payment for online purchases?"
|
||||
:group "payment"
|
||||
:choices (:radio "Credit/Debit Card" "PayPal" "Bank Transfer" "Cash on Delivery" "Cryptocurrency"))
|
||||
(:ask "Which social media platforms do you use regularly?"
|
||||
:group "socialmedia"
|
||||
:choices (:checkbox "Facebook" "Twitter" "Instagram" "LinkedIn" "TikTok" "None" :text "Other"))
|
||||
(:ask "How do you usually consume news?"
|
||||
:group "newsconsumption"
|
||||
:choices (:radio "Online News Websites" "Social Media" "Television" "Newspapers/Magazines" "Radio" "None"))))))
|
||||
|
||||
(format t (generate-questionnaire-page))
|
||||
#+end_src
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue