Question

我在GridView控件中有这样的记录

#          Name                 Priority
1          banana                  1
2          mango                   2
3          apple                   3 
4          water melon             4
5          grape                   5
6          pineapple               6
7          strawberry              7
8          blueberry               8

如果将优先级6拖到1，记录＆＃34;菠萝＆＃34;应该到第一名，其优先级应改为＆＃34; 1＆＃34;剩下的记录应该向下移动。

Answer 1

要在网格视图中交换行，它将有所帮助

设计：

<asp:GridView ID="gvLocations" runat="server" AutoGenerateColumns="false">
<Columns>
    <asp:TemplateField HeaderText="Id" ItemStyle-Width="30">
         <ItemTemplate>
             <%# Eval("Id") %>
             <input type="hidden" name="LocationId" value='<%# Eval("Id")    
                 %>' /> 
            </ItemTemplate>
     </asp:TemplateField>
     <asp:BoundField DataField="Location" HeaderText="Location" ItemStyle-  
      Width="150" />
<asp:BoundField DataField="Preference" HeaderText="Preference" ItemStyle-Width="100" />

用于拖放网格视图行的JavaScript代码：

<script type="text/javascript"     
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<link rel="stylesheet"               
href="https://ajax.googleapis.com/ajax/libs/jqueryui/
1.8.24/themes/smoothness/jq    uery-ui.css" /><script type="text/javascript"    
src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/jquery- 
ui.min.js"></script>
<script type="text/javascript">
$(function () {
$("[id*=gvLocations]").sortable({
    items: 'tr:not(tr:first-child)',
    cursor: 'pointer',
    axis: 'y',
    dropOnEmpty: false,
    start: function (e, ui) {
        ui.item.addClass("selected");
    },
    stop: function (e, ui) {
        ui.item.removeClass("selected");
    },
    receive: function (e, ui) {
        $(this).find("tbody").append(ui.item);
    }
});
});
</script>

拖放后保存网格：

protected void UpdatePreference(object sender, EventArgs e)
{
int[] locationIds = (from p in Request.Form["LocationId"].Split(',')
                        select int.Parse(p)).ToArray();
int preference = 1;
foreach (int locationId in locationIds)
{
    this.UpdatePreference(locationId, preference);
    preference += 1;
}

Response.Redirect(Request.Url.AbsoluteUri);
}

private void UpdatePreference(int locationId, int preference)
{
string constr =   ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
    using (SqlCommand cmd = new SqlCommand("UPDATE HolidayLocations SET Preference = @Preference WHERE Id = @Id"))
    {
        using (SqlDataAdapter sda = new SqlDataAdapter())
        {
            cmd.CommandType = CommandType.Text;
            cmd.Parameters.AddWithValue("@Id", locationId);
            cmd.Parameters.AddWithValue("@Preference", preference);
            cmd.Connection = con;
            con.Open();
            cmd.ExecuteNonQuery();
            con.Close();
        }
    }
}
}

有关详情：http://www.aspsnippets.com/Articles/Reorder-GridView-Rows-Drag-and-Drop-ordering-of-GridView-Rows-using-jQuery-in-ASPNet.aspx

在GridView

1 个答案: