这个
protected void Page_Load(object sender, EventArgs e) {
RadioButtonList1.Items.Add(new ListItem("London","1"));
RadioButtonList1.Items.Add(new ListItem("Paris", "2"));
}
和这个
<asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatLayout="Flow">
</asp:RadioButtonList></div>
生成类似这样的HTML
<input id="RadioButtonList1_0" type="radio" name="RadioButtonList1" value="1" />
<label for="RadioButtonList1_0">London</label>
<input id="RadioButtonList1_1" type="radio" name="RadioButtonList1" value="2" />
<label for="RadioButtonList1_1">Paris</label>
但我真正想要的是,请注意<label>
标记中的课程。
<input type="radio" name="Event" id="whatever" value="1" />
<label for="London" class="London">London</label>
<input type="radio" name="Event" id="whatever" value="2" />
<label for="Paris" class="Paris">Paris</label>
我可以将cssClass添加到自动生成的<label>
代码吗?
答案 0 :(得分:2)
您可以继承RadioButtonList
,如here或here所示。
最后一个链接可能更符合您的要求。
您应该只需要覆盖RenderItem方法,如下所示:
protected override void RenderItem(ListItemType itemType, int repeatIndex, RepeatInfo repeatInfo, HtmlTextWriter writer)
{
RadioButton radioButton = new RadioButton();
radioButton.Page = this.Page;
radioButton.GroupName = this.UniqueID;
radioButton.ID = this.ClientID + "_" + repeatIndex.ToString();
radioButton.Text = this.Items[repeatIndex].Text;
radioButton.Attributes["value"] = this.Items[repeatIndex].Value;
radioButton.Checked = this.Items[repeatIndex].Selected;
radioButton.TextAlign = this.TextAlign;
radioButton.AutoPostBack = this.AutoPostBack;
radioButton.TabIndex = this.TabIndex;
radioButton.Enabled = this.Enabled;
radioButton.CssClass = InnerCssClass;
radioButton.Style.Add(HtmlTextWriterStyle.BackgroundColor, this.Items[repeatIndex].Text);
radioButton.RenderControl(writer);
// add new label
Label radioLabel = new Label();
radioLabel.Text = this.Items[repeatIndex].Text;
radioLabel.CssClass = this.Items[repeatIndex].Text;
radioLabel.AssociatedControlID = this.ClientID + "_" + repeatIndex.ToString();
radioLabel.RenderControl(writer);
}
注意,我实际上并没有编译上面的代码,但应该足以指导你正确的方向:)
答案 1 :(得分:0)
我不是ASP.NET专业人员,但我知道您可以通过使用子选择器轻松控制具有已知ID的元素中LABEL的显示。
#myElementID LABEL {
padding: 5px;
}