I'm currently trying to build a custom multi-step form for a space reservation system in Drupal 9. One of the tasks that is hanging me up is showing a review of all the fields as the last step. I've tried to bind values mentioned here, but must be doing something wrong. Any suggestions would be much appreciated, thanks!
My .html.twig looks like:
<form data-multi-step>
<div class="card active" data-step>
<div class="dropdown-container">
<div class="dropdown reserve--type">
<input type="radio" name="reserveType" value="class" checked="checked" id="type-class" data-bind="type">
<label for="type-class">class</label>
<input type="radio" name="reserveType" value="cultural activity" id="type-cultural" data-bind="type">
<label for="type-cultural">cultural activity</label>
<input type="radio" name="reserveType" value="conversation group/tutoring" id="type-conversation" data-bind="type">
<label for="type-conversation">conversation group/tutoring</label>
<input type="radio" name="reserveType" value="faculty workshop" id="type-faculty" data-bind="type">
<label for="type-faculty">faculty workshop</label>
<input type="radio" name="reserveType" value="other" id="type-other" data-bind="type">
<label for="type-other">other</label>
</div>
{% if space.field_occupancy.value is not empty %}
<div class="dropdown reserve--occupancy">
<input type="radio" name="reserveOccupancy" value="1" checked="checked" id="occ-1" data-bind="occupancy">
<label for="occ-1">1</label>
{% for i in range(2, space.field_occupancy.value|number_format) %}
<input type="radio" name="reserveOccupancy" value="{{ i }}" id="occ-{{ i }}" data-bind="occupancy">
<label for="occ-{{ i }}">{{ i }}</label>
{% endfor %}
</div>
{% endif %}
</div>
<button type="button" class="button button--next" data-next>Next</button>
</div>
<div class="card--reserve" data-step>
... (similar to step 1)
</div>
<div class="card--reserve review" data-step>
<div data-update="type"></div>
<div data-update="occupancy"></div>
<button type="button" class="button button--back" data-previous>Back</button>
<button type="button" class="button button--submit" data-submit>Submit</button>
</div>
</form>