• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2745
  • Last Modified:

Remove border on checkbox in datalist

This has to be simple but I can't remove the border or set the background color in a checkbox or radio button created in a datalist. The class , border etc ends up in the surrounding span tag.

Any Ideas?

Glorfindal
0
glorfindal
Asked:
glorfindal
  • 5
  • 3
  • 2
1 Solution
 
praneethaCommented:
you get a border around it...i don't get any border around checkbox i tried in datalist
0
 
glorfindalAuthor Commented:
I'm getting a dark border and background around them and can't seem to get rid of it
0
 
glorfindalAuthor Commented:
Actually theres no dark background and the border looks like the sunken effect. Almost like having a checkbox inside a checkbox. I've never seen this before
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
praneethaCommented:
is it checkboxlist or checkbox..

if u dra and drop a checkbox on aspx page..and then if u have a checkbox in datalist

u r saying they both look different...

r u using any css class

and if you can post the <Asp:datalist code
0
 
glorfindalAuthor Commented:
Changed it to a repeater still the same
It's a checkbox


<asp:Repeater ID="UpsShippingList" Runat=server  OnItemDataBound="UpsShippingList_ItemDataBound">
  <ItemTemplate>                                                      
    <table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="eeeeee">
      <tr>
          <td width="15"><IMG height="1" alt="" src="common/images/transpix.gif" width="1" border="0"></td>
          <td width="20"><asp:CheckBox Name="ShipSelect" ID="ShipSelect" runat=server BorderStyle=None></asp:CheckBox></td>
         <td width="15"><IMG height="1" alt="" src="common/images/transpix.gif" width="1" border="0"></td>
         <td width="300"><asp:LinkButton ID="Select" CommandName="Select" Text='<%#  DataBinder.Eval(Container.DataItem, "ShipmentType") %>' Runat="server"></asp:LinkButton></td>
          <td width="150"><%#  DataBinder.Eval(Container.DataItem, "Cost") %><asp:Label ID="ShippingCost" runat=server text='<%# DataBinder.Eval(Container.DataItem, "Cost", "{0:c}") %>'></asp:Label></td>
    </tr>
</table>
</ItemTemplate>
</asp:Repeater>
0
 
praneethaCommented:
hey did u try adding checkbox on normal page..and see if both r looking diff...

may be they r not
0
 
glorfindalAuthor Commented:
I changed it to a "HtmlInputCheckBox" and the borders gone. Looked at a plain aspx page and the asp checkbox still has a border must be some Style somewhere causing the problem. I would think I could change the border to none in the <asp:CheckBox> tag and override anything else.
0
 
glorfindalAuthor Commented:
I've never seen style="border:none ! important" before. I'll have to remeber that but it did'nt work either. The problem is when the checkbox is created in the datalist the style is placed in a span tag surrounding the checkbox. I've have also tried adding the style as an attribute in the datalist ItemDataBound event. the strange thing is I am also adding a javascript OnClick event which attaches to the CheckBox while the style attaches to the span Tag. The Checkbox ends up as an html input type="checkbox" inside the Span tag. If I use a style on "input" the border goes away unfortunatly so does the border on all my text boxes. Ive got it working by using a "HtmlInputCheckBox" which dosn't have the border. This was a quick fix but isn't really the answer. I still would like to know how to add a style in the datalist as I can see this being a possible issue in the future. I am leaving this open to see if any one has the answer.
0
 
aspmaestroCommented:
>>If I use a style on "input" the border goes away unfortunatly so does the border on all my text boxes...

you can create a class for the style you wanna apply to your checkbox....like this

(place it between <head> and </head>)
<STYLE type="text/css">
 input.chkBox{border:none}
</STYLE>

now inside the checkbox tag, add this attribute :
class="chkBox"

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 5
  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now