Q:

jQuery Drag And Drop Multiple Gridview Rows with Checkbox

I am struggling to get my checkboxes clicked when a GridViewRow become selected. I am using the .sortable and .selectable jQuery Methods. Everything below works how I would like it to, however I would also like it to place a checkmark in my checkbox cbBulkSort which is within the first column of my GridView. Within the C# of my code I need to update the database and the Checkbox cbBulkSort helps determine which records I want to update. For an Example, I would like to select the bottom 2 rows of the GridView and send an update to the Database. However, I need the checkbox control to be checked in order to know which records to update.
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>

A:

I simply had to place the Checkbox within the <span> tag like 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>

