I am developing a Online Questionnaire application. In this I am using Checkbox and Labels inside a VBox and Hbox control to display the options for my answers. These answer options I am getting them from my questionnaire.json model.
Following is my App.view.xml showing the answers layout:
<VBox id="multipleChoices">
<items>
<HBox backgroundDesign="Solid" alignItems="Center">
<items>
<CheckBox id="mCheckBox0"/>
<Label text="" id="multipleChoice0" width="500px"/>
<CheckBox id="mCheckBox1"/>
<Label text="" id="multipleChoice1" width="500px"/>
</items>
</HBox>
<HBox backgroundDesign="Solid" alignItems="Center">
<items>
<CheckBox id="mCheckBox2"/>
<Label text="" id="multipleChoice2" width="500px"/>
<CheckBox id="mCheckBox3"/>
<Label text="" id="multipleChoice3" width="500px"/>
</items>
</HBox>
</items>
</VBox>
It gets applied in front end as follows:
Problem: You can see in Q2.png 4 Labels and 4 radio buttons are being displayed even though there are only two answer options. How do I achieve the scenario where the labels's and radio buttons/ check boxes appear in same number as the answer choices and extra ones are hidden? Is there a dynamic control which can help me with this one?
答案 0 :(得分:1)
您应该将问题从模型绑定到List,ListItem可以包含带有标签和复选框的模板,因此您无需关心答案的大小。你现在这样做的方式太过于静止。
答案 1 :(得分:1)
Checkbox具有 text 属性,因此您可以删除标签并在该属性中执行绑定
<CheckBox id="mCheckBox1" text="{model/textOption1}"/>
<CheckBox id="mCheckBox2" text="{model/textOption1}"/>