I finally did it... Hurray :) Feeling happy.
Observation
I observed the html generated for both the types (
Vertical and
Horizontal) of
RepeatDirection
property for
RadioButtonList
Control.
What I found is described below.
- Case - 1 (
RepeatDirection="Horizontal"
)
<span id="RadioButtonList1">
<input id="RadioButtonList1_0" type="radio" name="RadioButtonList1" value="Strongly Agree" />
<label for="RadioButtonList1_0">Strongly Agree</label>
<input id="RadioButtonList1_1" type="radio" name="RadioButtonList1" value="Agree" />
<label for="RadioButtonList1_1">Agree</label>
<input id="RadioButtonList1_2" type="radio" name="RadioButtonList1" value="Neutral" />
<label for="RadioButtonList1_2">Neutral</label>
<input id="RadioButtonList1_3" type="radio" name="RadioButtonList1" value="Disgree" />
<label for="RadioButtonList1_3">Disgree</label>
<input id="RadioButtonList1_4" type="radio" name="RadioButtonList1" value="Strongly Disgree" />
<label for="RadioButtonList1_4">Strongly Disgree</label>
</span>
- Case - 2 (
RepeatDirection="Vertical"
)
Note:- Here we can check that Break (br)
tags are getting added after labels to make the RadioButtons
Vertically aligned.
<span id="RadioButtonList1">
<input id="RadioButtonList1_0" type="radio" name="RadioButtonList1" value="Strongly Agree" />
<label for="RadioButtonList1_0">Strongly Agree</label><br />
<input id="RadioButtonList1_1" type="radio" name="RadioButtonList1" value="Agree" />
<label for="RadioButtonList1_1">Agree</label><br />
<input id="RadioButtonList1_2" type="radio" name="RadioButtonList1" value="Neutral" />
<label for="RadioButtonList1_2">Neutral</label><br />
<input id="RadioButtonList1_3" type="radio" name="RadioButtonList1" value="Disgree" />
<label for="RadioButtonList1_3">Disgree</label><br />
<input id="RadioButtonList1_4" type="radio" name="RadioButtonList1" value="Strongly Disgree" />
<label for="RadioButtonList1_4">Strongly Disgree</label>
</span>
Logic
Now my logic would be removing and adding these
Break (br)
tags as per the
RepeatDirection
.
- If
Break
tags are found (means currently it is Vertical
) after the labels, then they will be removed to make it Horizontal
. - Else if
Break
tags are not found(means currently it is Horizontal
), then they will be added to make it Vertical
.
Demo
[Demo] Change Repeat Direction of asp RadioButtonList[
^].
Take a look at the Demo how I achieved this.
Thanks a lot for the question. I learned some stuff due to this.