2013-10-15 60 views
0

有什麼方法可以選擇所有複選框而不使用任何js文件。每當我使用jquery 1.8.3或jquery 1.7.2時都會出現這種情況。我的其他js文件不運行或可能是由於他們不運行的一些問題。所以,我在gridview中有複選框,我想執行全選選項。JavaScript文件過度其他JavaScript文件

<asp:GridView Width="96%" HeaderStyle-HorizontalAlign="left" ID="gridimages" Font-Size="13px" HeaderStyle-Font-Size="15px" runat="server" OnSorting="gridimages_Sorting" AutoGenerateColumns="false" AllowSorting="true" CssClass="grid gridimages" HeaderStyle-BorderColor="#D0D0D0" AlternatingRowStyle-BorderColor="#D0D0D0" RowStyle-BorderColor="#D0D0D0" OnRowDataBound="gridimages_RowDataBound" AllowPaging="true" PageSize="50" PagerSettings-Mode="NumericFirstLast" OnPageIndexChanging="gridimages_PageIndexChanging" CellPadding="3" BorderColor="#D0D0D0" BorderStyle="Groove" BorderWidth="1px" OnSelectedIndexChanged="gridimages_SelectedIndexChanged" GridLines="both"> 
     <AlternatingRowStyle BackColor="White" ForeColor="#284775"/> 
    <%-- <RowStyle HorizontalAlign="Center" />--%> 
     <Columns> 

      <asp:TemplateField HeaderStyle-Width="20px" HeaderStyle-Font-Size="14px" HeaderStyle-ForeColor="Black"> 
      <HeaderTemplate> 
      <asp:CheckBox ID="chkSelectAll" class="checkAll" runat="server" Text="" onclick="SelectAllCheckboxes(this);" /> 
     </HeaderTemplate> 
       <ItemTemplate>  <div style="text-align: left;"> 
        <asp:HiddenField ID="hdn_id" runat="server" Value='<%#Eval("Id") %>' /> 

        <asp:CheckBox ID="CheckBoxImage" CssClass="CheckBoxImage1" onClick="CheckBoxImage();" runat="server" /></div> 
       </ItemTemplate> 
      </asp:TemplateField> 

javascript代碼:

  function SelectAllCheckboxes(chk) { 
     var gvcheck = document.getElementById('<%= gridimages.ClientID %>'); 
     var i; 
     //Condition to check header checkbox selected or not if that is true checked all checkboxes 
     if (chk.checked) { 
      for (i = 0; i < gvcheck.rows.length; i++) { 
       var inputs = gvcheck.rows[i].getElementsByTagName('input'); 
       inputs[0].checked = true; 
      } 
     } 
      //if condition fails uncheck all checkboxes in gridview 
     else { 
      for (i = 0; i < gvcheck.rows.length; i++) { 
       var inputs = gvcheck.rows[i].getElementsByTagName('input'); 
       inputs[0].checked = false; 
      } 
     } 
    } 

看的JavaScript代碼。我在var輸入中遇到問題。我想要var輸入中的CheckBoxImage的id,但無法做到。我需要在var輸入行中更改以獲取checkboximae的ID。請幫忙。

+0

顯示你的js代碼。 –

+0

以您描述的方式選擇多個複選框需要Javascript。沒有其他辦法可以做到這一點。 – 2013-10-15 09:22:25

+0

然後告訴我如何使用jQuery 1.8.3 – Manu

回答

0

只是不要這樣做與jQuery。 使用與您的任何文件不衝突的純javascript。

檢查此answser用於選擇由類型的元件用普通的js accessing-elements-by-type-on-javascript

雖然循環通過這些元件,可以使用屬性.checked =真對於每個元素。

+0

好吧..我正在嘗試這種方式 – Manu

+0

請再次看我的問題。我在JavaScript代碼中做了一些小改動。 – Manu

+0

每次循環時,都會創建一個新的var輸入。 只需在循環之外創建一次(var inputs = [])並像循環中的任何其他數組一樣使用它。輸入[I] .checked。 – MentalRay

0

使用純javascript。

HTML

<input type="checkbox" id="checkall" /><br /> 
<input type="checkbox" class="check" /> 
<input type="checkbox" class="check" /> 
<input type="checkbox" class="check" /> 
<input type="checkbox" class="check" /> 

的Javascript

var chkAll = document.getElementById("checkall"); 
chkAll.addEventListener('click', function(e) { 
    setCheck(this.checked); 
}); 

function setCheck(value) { 
    var items = document.getElementsByTagName("input"); 
    var itemLen = items.length; 
    for (i = 0; i < itemLen; i++) { 
     if (items[i].getAttribute("class") == "check") { 
      items[i].checked = value; 
     } 
    } 
} 

演示代碼:jsfiddle

+0

我的代碼在gridview – Manu

+0

當然這只是一個純JavaScript演示,你可以在代碼中應用相同的方法。我願意幫忙,但我沒有安裝aspx,對不起。 – RyanB

+0

請再看看我的問題。我在JavaScript代碼中做了一些改動。 – Manu