Syafah
Syafah

Reputation: 83

Checkbox not functioning in ASPX form

When I click the checkbox, there are no tick sign. What is wrong with my code?

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">..</asp:Content>  
<asp:Content ID="Content2" ContentPlaceHolderID="content" Runat="Server">

<div class="col1">&nbsp;</div>
<div class="col2">Password Composition</div>
<div class="col3">:</div>
<div id="cb" class="col4">
    <input type="checkbox" runat="server"/>
    Alphabet &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <input type="checkbox" runat="server" />
    Numeric &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <input type="checkbox" runat="server" />
    Symbol 
</div>
</div>

... </asp:Content>

 <asp:Content ID="Content3" ContentPlaceHolderID="Javascript" Runat="Server">...</asp:Content>

This is my css for checkbox:

input[type="checkbox"],
input[type="radio"] {
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
      box-sizing: border-box;
 padding: 0;
 cursor: pointer;
}

This form inherits from master page. Should I use < asp:Checkbox /> ? but I didn't know how to use them. Do give me an example that suit with my cases.

Upvotes: 1

Views: 205

Answers (1)

Syafah
Syafah

Reputation: 83

I know my problem already. The script below, inside the masterpage caused other elements' click event malfunction. When I remove it, then my checkbox functioning.

$(document).click(function (e) {
e.preventDefault();
if ( $(e.target).parents('.menu-wrapper').length == 0 && $('.menu-wrapper').is(':visible'))
{
$('.menu-wrapper').toggle('slide');
return false;
}
});

thanks everyone for helping.

Upvotes: 1

Related Questions