How to print nested content

[Mrafey]

Hello!

I have the following structure in the design manager:

The slides field group has repeater option set to 3. So it prints out 3 questions in which each has a question text property followed by an answers group field which has its repeater options set to 3 as well which outputs 3 answers for a given question.

My issue is I am having a hard time figuring out how to access those nested answers for each question.

This is what I have thus far:

<div class="quiz">
	<form class="quiz-form">
		
		{% for item in module.slides %}
		<div class="question">
			<h3>{{item.question}}</h3>
			  {% for answer in slides.answers %}
			    <label>Print</label>
			    <input type="radio"/>
			  {% endfor %}
		</div>
		{% endfor %}
		
		<div class="submit-btn">
			<input type="submit" class="button"/>
		</div>
	</form>
</div>

Based on what I have setup 3 radio buttons with the label Test should print out for each question, but that doesn't seem to happen. I am still new to HubL and I feel I am doing the nesting incorrectly. 

Some help regarding this would be great! 

Thanks!

 

[Stephanie-OG · Accepted solution]

Hi @Mrafey - if you hover over the "Slides" field group and click on Actions > Copy Snippet, it should give you the code. 

But basically if Slides is a repeater, when you have 

{% for item in module.slides %}

you're now within "item", so to get the Answers you would need to have: 

{% for answer in item.slides %}

Something like this should work: 

<div class="quiz">
	<form class="quiz-form">
		
		{% for item in module.slides %}
		<div class="question">
			<h3>{{ item.question }}</h3>
			  {% for answer in item.answers %}
			    <label>{{ answer.answer_label }}</label>
			    <input type="radio"/>
			  {% endfor %}
		</div>
		{% endfor %}
		
		<div class="submit-btn">
			<input type="submit" class="button"/>
		</div>
	</form>
</div>

I hope that helps!

[Mrafey]

Thank you, it works! 

[MattPickle]

This should do it. Within the loop, you access the fields for each answer group with {{ answer.<fieldname> }}.

{% for answer in slides.answers %}
  <label>{{ answer.answer_label }}</label>
  <input type="radio" name="{{ answer.answer_name }}" value="{{ answer.answer_value }}"/>
{% endfor %}

[Jaycee_Lewis]

Hi, @Mrafey 👋 Thanks for your question! I'd like to invite some of our community members to the conversation   hey @Stephanie-OG @MBERARD @arinker, do you have any tips you can share with @Mrafey?

Thank you for taking a look! — Jaycee