2013-07-24 3 views
0

안녕하세요, 저는 모든 열과 데이터를 잘 표시하는 gridview 있습니다. 문제는 헤더에 클릭하면 jquery를 사용하여 모든 행의 확인란을 선택하는 체크 상자가 있다는 것입니다. 그러나 헤더 체크 박스를 클릭하면 그리드 행의 체크 박스에 체크하지 않습니다. 머리글 확인란을 선택하면 모든 행의 나머지 확인란을 선택하지 않는 이유를 알 수없는 실수가 있습니다. 실수가 어디 있는지 알려주세요. 당신이 처리하는 자신의 JQuery와 비트를 작성하려는 경우jquery를 사용하여 gridview의 확인란을 선택하십시오.

<% @page language="C#" masterPageFile="~/first.master" %> 
    <asp:Content ID="xContent" ContentPlaceHolderID="xMainContentContainer" Runat="Server"> 
     <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script> 
      <script type="text/javascript" language="javascript"> 
       $("#<%=GridView3.ClientID%> input[id*='chkAll']:checkbox").click(function() { 
        if ($(this).is(':checked')) 
         $("#<%=GridView3.ClientID%> input[id*='chkEmployee']:checkbox").attr('checked', true); 
     else 
      $("#<%=GridView3.ClientID%> input[id*='chkEmployee']:checkbox").attr('checked', false); 
       });   
     </script> 

     <h1 class="title" id="page-title">Gridview Page</h1>  
     <form id="Form" runat="server"> 
      <asp:GridView ID="GridView3" runat="server" AutoGenerateColumns="False" 
       BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellPadding="3" CellSpacing="2"> 
       <Columns> 
       <asp:TemplateField> 
       <HeaderTemplate> 
        <asp:CheckBox runat="server" ID="chkAll" /> 
       </HeaderTemplate> 
       <ItemTemplate> 
        <asp:CheckBox runat="server" ID="chkEmployee" /> 
       </ItemTemplate> 
      </asp:TemplateField> 
        <asp:TemplateField HeaderText="Id"> 
         <ItemTemplate> 
          <asp:Label ID="Id" runat="server" Text='<%# Eval("Id") %>'></asp:Label> 
         </ItemTemplate> 
        </asp:TemplateField> 
        <asp:TemplateField HeaderText="Company"> 
         <ItemTemplate> 
          <asp:Label ID="lblCompany" runat="server" Text='<%# Eval("Company") %>'></asp:Label> 
         </ItemTemplate> 
        </asp:TemplateField> 
        <asp:TemplateField HeaderText="Location"> 
         <ItemTemplate> 
          <asp:Label ID="lblLocation" runat="server" Text='<%# Eval("Location") %>'></asp:Label> 
         </ItemTemplate> 
        </asp:TemplateField> 
       </Columns> 
      </asp:GridView> 
     </form> 
    </asp:Content> 

답변

0

당신은 chkAllthis.Checked를 사용하는 대신 $(this).is(':checked')에 의해 확인 여부를 테스트 할.

$(document).ready(function(){ 
    $("#<%= GridView1.ClientID %> input[id*='chkAll']").click(function() { 
     $("#<%= GridView1.ClientID %> input[id*='chkEmployee']").attr('checked', this.checked); 
    }); 
}); 
0

, 당신은 할 수 있습니다 :

// select your 'all' checkbox 
$('input.all').on('click', function(){ 
    $('input[type="checkbox"]').prop('checked', this.checked); 
}); 
+0

처럼 온 클릭 이벤트를 추가합니다. 나는 jquery를 처음 사용합니다. 감사 –

0

모든 행을 선택하거나 선택 취소하려면 이

function selectAll(checked) { 
     var isChecked = $(checked).attr('checked') ? true : false; 
     if (isChecked) { 
      $('input:checkbox[name$=chkEmployee]').each(
        function() { 
         $(this).attr('checked', 'checked'); 
        }); 
     } 
     else { 
      $('input:checkbox[name$=chkEmployee]').each(
        function() { 
         $(this).removeAttr('checked'); 
        }); 
     } 
    } 

을 시도하고 어떻게이 기능을 사용하려면 조금 정교한이

<HeaderTemplate> 
    <asp:CheckBox runat="server" ID="chkAll" onclick="selectAll(this);" /> 
    </HeaderTemplate> 
관련 문제