Fakultas Ilmu Komputer UI

Implement diet questionnaire UI layout and form validation


  • Revise step-by-step form design (first step consent is locked)

42_awal 42_afterconsent 42_done

  • Revise radio button group design (gender in dietela quiz changes)


New Components

  • Implement picker component


  • Implement checkbox group with "other" choice


  • Implement datepicker


Diet Questionnaire

  • Implement consent form

42_consent 42_consent2 42_consent3

  • Implement consent validation (if not filled or answered "No", next button is disabled)

42_consent_notlnjt 42_consent_lnjt

  • Implement part 1: identity form

42_datepicker 42_identitas2 42_identitas3

  • Implement part 1 validation (triggered when clicking "Lanjut" button but form is invalid)

42_identitaserror 42_identitas3error

  • Implement part 2: eating pattern form

42_polamakan1 42_polamakan2 42_polamakan3

  • Implement part 2 validation (allowed custom error message, different from form label)


  • Implement part 3: food consumption form

42_konsumsi1 42_konsumsi2

  • Implement part 4: lifestyle form

42_lifestyle1 42_checkboxgroup_with_other 42_lifestyle3

  • Implement part 5: healthy condition form

42_healthycondition1 42_healthycondition2 42_healthycondition3

Merge request reports