2011-11-14 8 views
0

は私が背後にあるコードからのlistItemsを追加するaspxASP.Net CheckBoxListの背景色

<asp:CheckBoxList ID="cblCalendarFilter" runat="server" /> 

にCheckBoxListのを持っています。

newCkItm = new ListItem(); 
newCkItm.Text = childrenFoldersData[i].Description.Trim(); 
newCkItm.Value = childrenFoldersData[i].Id.ToString().Trim(); 
newCkItm.Selected = true; 

私は色が別の項目とは異なることになり、アイテムの名前も違うだろう

newCkItm.Attributes.Add("style", "background-color:Red;"); 

でのListItemの背景を追加することができます。だから、問題は背景色がテキストの長さだけをカバーしていることです。背景色は、すべてのアイテムに対して調整されていません。私はインスペクタでチェックし、それを発見..

  • 背景色のスタイルが
  • すべてのスパンが<td>内にあるテキストを囲む<span>に適用されます。

多くの努力なしに<td>にそのスタイルを適用する方法がある場合、私は疑問に思って。私はむしろ名前を検索することでjqueryとjavascriptを使用しません。

これを行う方法はありますか?

<table> 
    <asp:Repeater ID="rpt" runat="server" OnItemDataBound="rpt_ItemDataBound"> 
     <ItemTemplate> 
      <tr> 
       <td id="myTd" runat="server"> 
        <asp:CheckBox runat="server" ID="myCheckBox" /> 
       </td> 
      </tr> 
     </ItemTemplate> 
    </asp:Repeater> 
</table> 

答えて

0

代わりの各項目にスタイル属性を追加し、そしてあなたは、各項目が異なる背景色を必要と言及したので、私はIDを追加したいです属性:あなたはなど、あなたのコードから分離して再コンパイルする必要はありませんあなたはCSSを微調整する必要があるたびにすべてのあなたのスタイルを維持することができます

newCkItm.Attributes.Add("id", "alpha"); 

その方法。

#cblCalendarFilter { 
    border:none; 
    border-collapse:collapse; 
} 

#cblCalendarFilter td { 
    padding:0; 
} 

#cblCalendarFilter span { 
    display:block; 
    padding:2px; 
} 

#cblCalendarFilter #alpha { 
    background:red; 
} 

#cblCalendarFilter #beta { 
    background:yellow; 
} 

がうまくいけば、あなただけのテキストの長さをカバーする背景色としていた問題を修正しますスパンブロックレベルを作る: <asp:CheckBoxList />

CSS自体は、次のようになります。

0

個別に要素にアクセスし、項目にCSSを割り当てる必要があります。私はforeachループを使い、アイテムにアクセスし、属性を追加する傾向があります。 TBH、私はいくつかの余分な機能が必要でない限り、私はリピーターと比較してチェックボックスリストにとどまるだろう

+0

私はAsp.Netチェックボックスリストを使用してそれを行う方法を考えています – william

+0

あなたのリクエストはそれほど一般的ではないので、特別な方法で対処する必要があります:) – misha

+0

フォントの色代わりに、それはそんなに "目を邪魔する"ではないでしょうか? – misha

0

私は他の方法がないと思う:あなたはその中CheckBoxで/ TDをTRとあなたがTDを取得することができItemDataBoundイベントにロジックを行いましたリピータを使用する場合、どの程度

1

私はこのソリューションを試してみたところ、&私のために働いた。

ただ、例えばパディング右 を与えることを試みる:

newCkItm.Attributes.Add("style", "background-color:Red;padding-right:30px");