网格排序图像升序动态降序 [英] Grid Sort Image Ascending Descending Dynamically

问题描述

我有一个网格，当单击列的标题(在标题单元格中的任何位置)时，该数据将对数据进行排序.
我想做的是，当数据处于上升方向"时，单击一下即可看到一个向上的箭头，反之亦然.
我在带有标题文本的标题单元格中有两个向上和向下的箭头imagebutton，但是我在标题单元格中的clickevent不能用作

< HeaderTemplate>
< asp:标签ID ="lblAD" runat =服务器" Text ="AD"/>
< asp:ImageButton ID ="ImgbtnA" ImageUrl =〜/images/uparrow.jpg" runat =服务器" Visible ="true" CommandName =排序"/>
< asp:ImageButton ID ="ImgbtnD" ImageUrl =〜/images/downarrow.jpg" runat =服务器" Visible ="true" CommandName =排序"/>
</HeaderTemplate>
在TemplateField中不起作用.
我想要页眉文本和箭头(一次一个).

谢谢.

Hi,
I have a Grid which sorts data when clicked on the Header of the Column(anywhere in the Header Cell).
What I want to do is at a click when the Data is in Ascending Direction an upward Arrow should be visible and vice versa.
I have two arrow upwards and downwards imagebutton in the Header cell with the Header Text but then my clickevent in the Header cell does not work as

<HeaderTemplate>
<asp:Label ID="lblAD" runat="server" Text="AD"/>
<asp:ImageButton ID="ImgbtnA" ImageUrl="~/images/uparrow.jpg" runat="server" Visible="true" CommandName="Sort"/>
<asp:ImageButton ID="ImgbtnD" ImageUrl="~/images/downarrow.jpg" runat="server" Visible="true" CommandName="Sort"/>
</HeaderTemplate>
does not work in the TemplateField does not work.
I want the Header Text as well as the arrows(one at a time).

Thank You.

推荐答案

我这样做的方法是将图像添加到预先渲染的网格上，如下所示:

创建一个私有字段:

The way I do this is by adding the image on the pre-render of the grid like so:

create a private field:

private property gvSortExpression as string

GridView.Sorting事件中的下一个:

next on the GridView.Sorting event:

    Protected Sub gv_Sorting(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewSortEventArgs) Handles gv.Sorting
        'Set the sort direction
        If gvSortExpression <> e.SortExpression Then
            gvSortDirection = "ASC"
        Else
            If gvSortDirection = "ASC" Then
                gvSortDirection = "DESC"
            Else
                gvSortDirection = "ASC"
            End If
        End If

        'Set the expression
        gvSortExpression = e.SortExpression

'bind the grid
        LoadGrid()
    End Sub

在gridview预渲染事件中的下一个添加图像:

next in the gridview pre-render event add the image:

Protected Sub gv_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles gv.PreRender
        If Not String.IsNullOrEmpty(gvSortExpression) Then
            Dim img As New Image
            Dim colIndex As Integer = 0

            'Get the column to sort by and add image to
            Dim dcf As DataControlField = Nothing
            For colIndex = 0 To gv.Columns.Count - 1
                dcf = gv.Columns(colIndex)
                If dcf.SortExpression = gvSortExpression Then
                    Exit For
                End If
            Next

            'Update current col flag
            gvCurrentColumn = colIndex

            'Set the image and sort direction
            img.Style.Add("padding-left", "10px")
            If gvCurrentColumn = colIndex Then
                If gvSortDirection.ToUpper = "ASC" Then
                    img.ImageUrl = "~/tblSortDesc.gif"
                Else
                    img.ImageUrl = "~/tblSortAsc.gif"
                End If
            Else
                img.ImageUrl = "~/tblSortAsc.gif"
            End If

            'Add the sort image
            gv.HeaderRow.Cells(colIndex).Controls.Add(img)
        End If
    End Sub

而您的C#将是:

and your c# would be:

private string gvSortExpression { get; set; }

protected void gv_Sorting(object sender, System.Web.UI.WebControls.GridViewSortEventArgs e)
{
	//Set the sort direction
	if (gvSortExpression != e.SortExpression) {
		gvSortDirection = "ASC";
	} else {
		if (gvSortDirection == "ASC") {
			gvSortDirection = "DESC";
		} else {
			gvSortDirection = "ASC";
		}
	}

	//Set the expression
	gvSortExpression = e.SortExpression;

	//bind the grid
	LoadGrid();
}

protected void gv_PreRender(object sender, System.EventArgs e)
{
	if (!string.IsNullOrEmpty(gvSortExpression)) {
		Image img = new Image();
		int colIndex = 0;

		//Get the column to sort by and add image to
		DataControlField dcf = null;
		for (colIndex = 0; colIndex <= gv.Columns.Count - 1; colIndex++) {
			dcf = gv.Columns(colIndex);
			if (dcf.SortExpression == gvSortExpression) {
				break; // TODO: might not be correct. Was : Exit For
			}
		}

		//Update current col flag
		gvCurrentColumn = colIndex;

		//Set the image and sort direction
		img.Style.Add("padding-left", "10px");
		if (gvCurrentColumn == colIndex) {
			if (gvSortDirection.ToUpper == "ASC") {
				img.ImageUrl = "~/tblSortDesc.gif";
			} else {
				img.ImageUrl = "~/tblSortAsc.gif";
			}
		} else {
			img.ImageUrl = "~/tblSortAsc.gif";
		}

		//Add the sort image
		gv.HeaderRow.Cells(colIndex).Controls.Add(img);
	}
}

这篇关于网格排序图像升序动态降序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！