2016-08-17 2 views
0

Ich habe Schwierigkeiten, meine Kontrollkästchen zu aktivieren, wenn eine GridViewRow ausgewählt wird. Ich verwende die .sortable und .selectable jQuery Methoden. Alles unten funktioniert so, wie ich es gerne hätte, aber ich möchte auch, dass es ein Häkchen in meine Checkbox cbBulkSort setzt, welches sich in der ersten Spalte meiner GridView befindet. Innerhalb der C# meines Codes muss ich die Datenbank aktualisieren und die Checkbox cbBulkSort hilft zu bestimmen, welche Datensätze ich aktualisieren möchte. Für ein Beispiel möchte ich die unteren 2 Zeilen der GridView auswählen und ein Update an die Datenbank senden. Ich muss jedoch das Checkbox-Steuerelement überprüfen, um zu wissen, welche Datensätze zu aktualisieren sind.jQuery Ziehen und Ablegen mehrerer Gridview-Zeilen mit Kontrollkästchen

jQuery

$(function() { 
     $('[id*=gvSchedule]').selectable({ 
      cancel: '.sort-handle' 
     }).sortable({ 
      items: 'tr:not(tr:first-child)', 
      cursor: 'pointer', 
      handle: '.sort-handle', 
      helper: function (e, item) { 
       if (!item.hasClass('ui-selected')) { 
        item.parent().children('.ui-selected').removeClass('ui-selected'); 
        item.addClass('ui-selected'); 
       } 

       var selected = item.parent().children('.ui-selected').clone(); 
       item.data('multidrag', selected).siblings('.ui-selected').remove(); 
       return $('<li/>').append(selected); 
      }, 
      stop: function (e, ui) { 
       var selected = ui.item.data('multidrag'); 
       ui.item.after(selected); 
       ui.item.remove(); 
      } 
     }); 
    }); 

CSS

#gvSchedule { 
     list-style: none; 
     padding-left: 0; 
    } 

    #gvSchedule .sort-handle { 
     display: none; 
    } 

    #gvSchedule .ui-selected .sort-handle 
    { 
     display: inline; 
     padding: 0 0.5em; 
     cursor: pointer; 
    } 

    tr.ui-selected { 
     background-color: #D71826; 
     color: black; 
     font-weight: bold; 
     background-image: none; 
    } 
    tr.ui-selecting { 
     background-color: #D71826; 
     color: white; 
     font-weight: bold; 
     background-image: none; 
    } 

Asp.Net

<asp:GridView ID="gvSchedule" runat="server" AutoGenerateColumns="false" DataKeyNames="RowNum,TOG_aspirationId" OnRowEditing="OnRowEditing" RowStyle-Wrap="false"> 
      <Columns> 
       <asp:TemplateField HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding"> 
        <ItemTemplate> 
         <span class="sort-handle">&#9778;</span> 
         <asp:CheckBox ID="cbBulkSort" runat="server" /> 
         <input type="hidden" name="AspirationId" value='<%# Eval("TOG_aspirationId") %>' /> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:BoundField DataField="TOG_asp_time" HeaderText="Asp Time" SortExpression="tog_asp_time" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" ItemStyle-Width="50" /> 
       <asp:BoundField DataField="tog_donoridname" HeaderText="Donor" SortExpression="tog_donoridname" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:BoundField DataField="tog_sireidname" HeaderText="Sire" SortExpression="tog_sireidname" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:BoundField DataField="tog_sementypename" HeaderText="Semen Type" SortExpression="tog_sementypename" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:BoundField DataField="tog_parityname" HeaderText="Parity" SortExpression="tog_parityname" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:BoundField DataField="tog_breedname" HeaderText="Breed" SortExpression="tog_breedname" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:BoundField DataField="tog_poolname" HeaderText="Pooled" SortExpression="tog_poolname" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:BoundField DataField="tog_accountidname" HeaderText="Account" SortExpression="tog_accountidname" ReadOnly="true" HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" /> 
       <asp:TemplateField HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding" > 
       <ItemTemplate> 
        <asp:LinkButton Text="Edit" runat="server" CommandName="Edit" /> 
       </ItemTemplate> 
       <EditItemTemplate> 
        <asp:LinkButton Text="Update" runat="server" OnClick="OnUpdate" /> 
        <asp:LinkButton Text="Cancel" runat="server" OnClick="OnCancel" /> 
       </EditItemTemplate> 
      </asp:TemplateField> 
      </Columns> 
      <AlternatingRowStyle BackColor="#e9e9e9" /> 
      <HeaderStyle BackColor="#e9e9e9" ForeColor="#D71826" /> 
      <EmptyDataTemplate> 
       Empty 
      </EmptyDataTemplate> 
     </asp:GridView> 

Antwort

0

Ich hatte einfach im <span> Tag die Checkbox zu setzen wie so

  <asp:TemplateField HeaderStyle-CssClass="gvInventoryPadding" ItemStyle-CssClass="gvInventoryPadding"> 
       <ItemTemplate> 
        <span class="sort-handle">&#9778;<asp:CheckBox ID="cbBulkSort" runat="server" /></span> 
        <input type="hidden" name="AspirationId" value='<%# Eval("TOG_aspirationId") %>' /> 
       </ItemTemplate> 
      </asp:TemplateField> 
Verwandte Themen