CODEWITHSUNDEEP
asp.netcheckboxlist
Emerica.
Emerica.

Reputation: 568

Making Checkboxlist invisible

I have a checkboxlist in ASP.net with several choices in it. Is there a way that I can make the physical check able box invisible? I want it so that only the item in question is visible, but the box is invisible. If this is not possible can somebody recommend an alternate ASP control that would behave similarly to the checkboxlist?

For example I have a checkboxlist such as this:

<asp:CheckBoxList  ID="Example" runat="server" AutoPostBack="false" RepeatColumns="2" RepeatDirection="Horizontal">        
        <asp:ListItem> 1 </asp:ListItem> 
        <asp:ListItem> 2 </asp:ListItem> 
        <asp:ListItem> 3 </asp:ListItem> 
        <asp:ListItem> 4 </asp:ListItem> 
        <asp:ListItem> 5 </asp:ListItem> 
 </asp:CheckBoxList>

Now I want only the number to be visible and selectable, but I want to the checkbox to be invisible. Much like the way a button works but I feel as though creating x amount of buttons may be more tedious.

As per the answer I have tried the demo Jquery and came out with this:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Testjq.Test" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type = "text/javascript" src ="Scripts/jquery-1.7.1.min.js"></script>
<script type = "text/javascript" src ="Scripts/jquery-ui-1.8.18.custom.min.js"></script>
<script>
    $(function () {
        $("#check").button();
        $("#format").buttonset();
    });
    </script>
    <style>
    #format { margin-top: 2em; }
    </style>
    <title></title>
</head>
<body>



<div class="demo">

<input type="checkbox" id="check" /><label for="check">Toggle</label>

<div id="format">
    <input type="checkbox" id="check1" /><label for="check1">B</label>
    <input type="checkbox" id="check2" /><label for="check2">I</label>
    <input type="checkbox" id="check3" /><label for="check3">U</label>
</div>

</div><!-- End demo -->

</body>
</html>

Unfortunatley I still cannot get it to work. Any additional help would be much appreciated.

Upvotes: 0

Views: 515

Answers (1)

Davidson Sousa
Davidson Sousa

Reputation: 1353

Did you check the jQueryUI?

Take a look at the demo page: http://jqueryui.com/demos/button/#checkbox

If I understood well they have exactly what you are looking for.

Upvotes: 1

Related Questions