如何在ASP.Net GridView中使用AutoGenerateEditButton的图像而不是文本

时间:2010-07-18 21:49:30

标签: asp.net gridview

我正在使用AutoGenerateEditButton以及删除和选择。

我想使用图片而不是文字作为链接。

我该怎么做?

我不想手动创建命令列,因为AutoGenerate属性用于我正在处理的大型项目中。

4 个答案:

答案 0 :(得分:5)

最简单的方法是自己处理。以下是使用ImageButton替换编辑命令按钮的快速示例:

<asp:GridView ID="yourGrid" runat="server" OnRowEditing="yourGrid_RowEditing">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:ImageButton ID="yourEditButton" runat="server"
                    CommandName="Edit" ImageUrl="edit.jpg" />
            </ItemTemplate>
            <EditItemTemplate>
                <!-- your edit controls here -->
            </EditItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

现在为后面的代码:

protected void yourGrid_RowEditing(object sender, GridViewEditEventArgs e)
{
    // You could just do yourGrid and ignore casting the sender but this 
    // makes the code generic for reuse.
    GridView grid = (GridView)sender;   
    grid.EditIndex = e.NewEditIndex;
    BindData(); // need to rebind once the edit index is set.
}

这几乎取代了自动生成的编辑按钮ImageButton。通过将CommandName设置为编辑,它将触发与自动生成的编辑按钮完全相同的事件。这也适用于删除,更新等...

答案 1 :(得分:3)

对GridView控件进行子类化并覆盖CreateChildControls方法

    protected override int CreateChildControls(System.Collections.IEnumerable dataSource, bool dataBinding)
    {
        // re-use the AutoGenerate...Button properties
        bool showDelete = AutoGenerateDeleteButton;
        bool showEdit = AutoGenerateEditButton;
        bool showSelect = AutoGenerateSelectButton;

        // turn them all off, we'll be creating our own
        AutoGenerateDeleteButton = false;
        AutoGenerateEditButton = false;
        AutoGenerateSelectButton = false;

        // hide the column if it already exists
        if (Columns[0].GetType() == typeof(CommandField))
        {
            Columns.RemoveAt(0);
        }

        // add the command column if necessary
        if (showDelete || showEdit || showSelect)
        {
            CommandField cmdField = new CommandField();
            cmdField.HeaderText = string.Empty;
            cmdField.ButtonType = ButtonType.Image;
            cmdField.ShowSelectButton = showSelect;
            cmdField.ShowEditButton = showEdit;
            cmdField.ShowDeleteButton = showDelete;
            cmdField.DeleteImageUrl = "~/images/delete.bmp";
            cmdField.EditImageUrl = "~/images/edit.bmp";
            cmdField.SelectImageUrl = "~/images/select.bmp";

            Columns.Insert(0, cmdField);
        }

        // this will show the grid even if there is no data
        int numRows = base.CreateChildControls(dataSource, dataBinding);

        //no data rows created, create empty table if enabled
        if (numRows == 0 && ShowWhenEmpty)
        {
            //create table
            Table table = new Table();
            table.ID = this.ID;

            //convert the exisiting columns into an array and initialize
            DataControlField[] fields = new DataControlField[this.Columns.Count];
            this.Columns.CopyTo(fields, 0);

            if (this.ShowHeader)
            {
                //create a new header row
                _headerRow2 = base.CreateRow(-1, -1, DataControlRowType.Header, DataControlRowState.Normal);

                this.InitializeRow(_headerRow2, fields);
                table.Rows.Add(_headerRow2);
            }

            //create the empty row
            GridViewRow emptyRow = new GridViewRow(-1, -1, DataControlRowType.EmptyDataRow, DataControlRowState.Normal);

            TableCell cell = new TableCell();
            cell.ColumnSpan = this.Columns.Count;
            cell.Width = Unit.Percentage(100);
            if (!String.IsNullOrEmpty(EmptyDataText))
                cell.Controls.Add(new LiteralControl(EmptyDataText));

            if (this.EmptyDataTemplate != null)
                EmptyDataTemplate.InstantiateIn(cell);

            emptyRow.Cells.Add(cell);
            table.Rows.Add(emptyRow);

            if (this.ShowFooter)
            {
                //create footer row
                _footerRow2 = base.CreateRow(-1, -1, DataControlRowType.Footer, DataControlRowState.Normal);

                this.InitializeRow(_footerRow2, fields);
                table.Rows.Add(_footerRow2);
            }

            this.Controls.Clear();
            this.Controls.Add(table);
        }

        // I wanted one place to set alternating color for all instances of this control
        base.AlternatingRowStyle.BackColor = System.Drawing.Color.LightBlue;

        // now that the controls have been created, it's safe to reset these to their original values.  They'll be needed if you bind data later
        AutoGenerateDeleteButton = showDelete;
        AutoGenerateEditButton = showEdit;
        AutoGenerateSelectButton = showSelect;

        return numRows;
    }

答案 2 :(得分:1)

您可以参加GridView.RowDataBound活动。在那,使用FindControl做自定义你的自动生成按钮:

protected void yourGridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        LinkButton link = e.Row.Cells[0].Controls[0] as LinkButton;
        // do your stuff
    }
}

答案 3 :(得分:0)

超级古老的帖子,但是对于任何想要干净可重用的课程的人而言:

public class ImageGridview : GridView{
    protected override ICollection CreateColumns(PagedDataSource dataSource, bool useDataSource)
    {
        ArrayList fieldsArray = base.CreateColumns(dataSource, useDataSource);
        CommandField cf = (from o in fieldsArray
                           where o.GetType() == typeof(CommandField)
                           select (CommandField)o).FirstOrDefault();
        if (cf != null)
        {
            cf.ButtonType = ButtonType.Image;
            cf.DeleteImageUrl = "~/images/delete.png";
            cf.EditImageUrl = "~/images/edit.png";
            cf.SelectImageUrl = "~/images/select.png";
            cf.CancelImageUrl = "~/images/cancel.png";
            cf.UpdateImageUrl = "~/images/update.png";
        }
        return fieldsArray;
    }
}