How to create custom delete and edit button in gridview using asp.net

How to create custom delete and edit button in grid view using asp.net :

Why the delete button is not working and just refreshing page when clicked for the first time and then works at the second time. Know i will try to solve this problem here.
First we create a gridview in .aspx page .

<asp:GridView ID="GuitarBrandsGridView" runat="server" CssClass="mydatagrid"
PagerStyle-CssClass="pager" HeaderStyle-CssClass="header" RowStyle-CssClass="rows"
AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="id"
DataSourceID="SqlDataSource0" OnRowDataBound="GuitarBrandsGridView_RowDataBound"
OnRowCancelingEdit="GuitarBrandsGridView_RowCancelingEdit"
OnRowEditing="GuitarBrandsGridView_RowEditing"
OnRowUpdating="GuitarBrandsGridView_RowUpdating"
OnRowDeleting="GuitarBrandsGridView_RowDeleting" Width="864px" Height="250px">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:Button ID="GuitarBrandsGridViewBtnDelete" runat="server"
CommandName="Delete" Text="Delete"/>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:Button ID="GuitarBrandsGridViewBtnEdit" runat="server"
CommandName="Edit" Text="Edit"/>
</ItemTemplate>
<EditItemTemplate>
<asp:Button ID="GuitarBrandsGridViewBtnUpdate" runat="server"
CommandName="Update" Text="Update"/>
<asp:Button ID="GuitarBrandsGridViewBtnCancel" runat="server"
CommandName="Cancel" Text="Cancel"/>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="id" SortExpression="id">
<EditItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("id") %>'>
</asp:Label>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# Bind("id") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="type" SortExpression="type">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("type") %>'>
</asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label3" runat="server" Text='<%# Bind("type") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="name" SortExpression="name">
<EditItemTemplate>
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("name") %>'>
</asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label4" runat="server" Text='<%# Bind("name") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="image" SortExpression="image">
<EditItemTemplate>
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("image") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="Label5" runat="server" Text='<%# Bind("image") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle CssClass="header"></HeaderStyle>
<PagerStyle CssClass="pager"></PagerStyle>
<RowStyle CssClass="rows"></RowStyle>
</asp:GridView>
</div>
<asp:SqlDataSource ID="SqlDataSource0" runat="server"
ConnectionString="<%$ ConnectionStrings:brandsConnection %>"
DeleteCommand="DELETE FROM [guitarBrands] WHERE [id] = @id"
InsertCommand="INSERT INTO [guitarBrands] ([id], [type], [name], [image])
VALUES (@id, @type, @name, @image)"
SelectCommand="SELECT [id], [type], [name], [image] FROM [guitarBrands]"
UpdateCommand="UPDATE [guitarBrands]
SET [type] = @type, [name] = @name, [image] = @image WHERE [id] = @id">
<DeleteParameters>
<asp:Parameter Name="id" Type="Int32" />
</DeleteParameters>