ASP.NET GridView, change properties in Button from ItemTemplate - asp.net

I have a GridView that renders books from a database.
In each line a Delete/Edit button is rendered. When the user clicks the Edit button, I want the the Cancel and Update buttons to appear and the Edit buttton to become disabled.
I thought about using the onClick event for the Edit button along with the GridView row for getting the appropriate button based on the row, setting the Edit button's Enable property to false and the visibility of the Cancel and Update buttons to true.
However, it seems I can not change the properties even for the Edit button that I get from the event handler.
Here is the code.
protected void EditButton_Click(object sender, EventArgs e)
{
Button Sender = (Button)sender;
Sender.Text = "??"; //THIS CHANGE IS NOT APPLIED!!
//Button Sender = (Button)sender;
//GridViewRow grdRow = (GridViewRow)Sender.Parent.Parent;
//Button btn = (Button)grdBooks.Rows[grdRow.RowIndex].Cells[1].FindControl("CancelButton");
}
<asp:GridView
id="grdBooks"
DataSourceID="srcBooks"
DataKeyNames="Product_ID"
AutoGenerateColumns="false"
CssClass="products"
GridLines="none"
Runat="server" OnRowCreated="grdBooks_RowCreated">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:Button CausesValidation="false" ID="DeleteButton" CommandName="Delete" runat="server" Text="Delete" />
<asp:Button CausesValidation="false" ID="EditButton" CommandName="Edit" runat="server" Text="Edit" OnClick="EditButton_Click" />
<asp:Button CausesValidation="false" ID="CancelButton" Enabled="false" Visible="true" CommandName="Cancel" runat="server" Text="Cancel" />
<asp:Button CausesValidation="false" ID="UpdateButton" Enabled="false" Visible="true" CommandName="Update" runat="server" Text="Update" />
</ItemTemplate>
</asp:TemplateField>
<%-- <asp:CommandField ButtonType="Button" ShowEditButton="true"/>--%>
<asp:BoundField
DataField="ISBN"
ReadOnly="true"
HeaderText="ISBN" />
<asp:BoundField
DataField="Title"
ReadOnly="true"
HeaderText="Title" />
<asp:BoundField
DataField="First_Name"
ReadOnly="true"
HeaderText="First Name" />
<asp:BoundField
DataField="Last_Name"
ReadOnly="true"
HeaderText="Last Name" />
<asp:BoundField
DataField="Price"
HeaderText="Price" />
<asp:BoundField
DataField="Quantity"
HeaderText="Quantity" />
</Columns>
</asp:GridView>

After the event is handled, the page probably reloads and resets the original text.
Maybe you could use JavaScript to do what you need.

Ok, it's very simple after all, there is this beautiful tag within the GridView that does exactly what i want..
Thanks for viewing, hope this post helps more niewbies..
<EditItemTemplate>
<asp:Button CausesValidation="false" ID="CancelButton" CommandName="Cancel" runat="server" Text="Cancel" />
<asp:Button CausesValidation="false" ID="UpdateButton" CommandName="Update" runat="server" Text="Update" />
</EditItemTemplate>

Related

"Update/Cancel" buttons don't appear in TemplateField Edit button

When you create an edit button in every row of a Gridview using CommandField it displays update/cancel buttons after clicking, so you can accept/cancel changes.
However, I want an edit button that has tooltip text, and since CommandField doesn't have tooltip property, i used TemplateField. It worked with the delete button, but I'm having problems with the edit button:
<asp:GridView ID="GridView1" runat="server"
AllowPaging="True" AllowSorting="True"
DataMember="DefaultView"
DataSourceID="SqlDataSource1" AutoGenerateColumns="False"
DataKeyNames=FIELD,FIELD,FIELD" CellPadding="4" ForeColor="#333333" Width="90%"
Height="90%" Font-Size="Small">
<RowStyle BackColor="#EFF3FB" />
<Columns>
<asp:BoundField DataField="FIELD" HeaderText="FIELD" ReadOnly="True"
SortExpression="FIELD" />
<asp:BoundField DataField="FIELD" HeaderText="FIELD"
SortExpression="FIELD" />
<asp:BoundField DataField="FIELD" HeaderText="FIELD"
SortExpression="FIELD" />
<asp:BoundField DataField="FIELD" HeaderText="FIELD" ReadOnly="True"
SortExpression="FIELD" />
<asp:BoundField DataField="FIELD" HeaderText="FIELD" ReadOnly="True"
SortExpression="FIELD" />
<asp:BoundField DataField="FIELD" HeaderText="FIELD"
SortExpression="FIELD" />
<asp:CommandField ButtonType="Image" Visible="true" EditText="Edit" ShowEditButton="True" EditImageUrl="images/pencil1.png"></asp:CommandField>
<asp:TemplateField >
<ItemTemplate>
<asp:ImageButton ID="deleteButton" runat="server" CommandName="Delete" Text="Delete"
OnClientClick="return confirm('¿Are you sure?');" ToolTip="delete" ImageUrl="images/DeleteRed1.png" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#2461BF" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:DBUserInterfaceConnectionString %>"
SelectCommand="SELECT ... FROM ... INNER JOIN ... ON ..."
DeleteCommand="DELETE FROM ... WHERE ...=#param;"
UpdateCommand="UPDATE ... SET ... = #param, ... = #param2 WHERE ... = #param3 and ... = #param4 and ... = #param5;"
>
</asp:SqlDataSource>
As I said before, I replaced CommandField with:
<asp:TemplateField >
<ItemTemplate>
<asp:ImageButton ID="editButton" runat="server" CommandName="Edit" Text="Edit" ToolTip="Edit" ImageUrl="images/pincel1.png" />
</ItemTemplate>
</asp:TemplateField >
but "Update/Cancel" buttons don't appear, so I can't update/edit anything. Why does it happen?
Any Ideas to implement a succesful edit button?
NOTES:
Both buttons don't have vb code behind, for some reason delete button works just with DeleteCommand in the SqlDataSource, and if I try to delete the command, it prompts error because no DeleteCommand is specified.
UpdateCommand has no purpose, it can be deleted. I could use it for a update button instead of an edit button, but when i tried, it says #params are not known, that's why I decided to use edit button instead.
The <asp:TemplateField> is used when you want to set your own-defined i.e. User-Defined content for each item in the GridView control.
The <asp:CommandField> is used when you want to use pre-defined command buttons to perform select, edit, or delete operations. Check MSDN here.
So, when your are using your own user-defined way for edit button, you also need to specify your custom content way for Update & Cancel button inside <EditItemTemplate> as :
<asp:TemplateField>
<ItemTemplate>
<asp:ImageButton ID="editButton" runat="server" CommandName="Edit" Text="Edit"
ToolTip="Edit" ImageUrl="images/pincel1.png" />
</ItemTemplate>
<EditItemTemplate>
<asp:ImageButton ID="BtnUpdate" runat="server" CommandName="Update" Text="Update"
OnClick="BtnUpdate_Click" ImageUrl="images/Update.png"/>
<asp:ImageButton ID="BtnCancel" runat="server" CommandName="Cancel" Text="Cancel"
OnClick="BtnCancel_Click" ImageUrl="images/Cancel.png"/>
</EditItemTemplate>
</asp:TemplateField>
And just make sure, Only if you are again providing your Custom Implementation for Update & Cancel logic, you also define the onclick events for these two Update and Cancel buttons. Else remove the OnClick from markup of these buttons.
[ BtnUpdate_Click & BtnCancel_Click here.]
I think since you've converted it to a TemplateField, all of the automatically-functioning stuff (like Update/Cancel buttons) has been disabled. I'm betting you'll need to add an <EditItemTemplate> with the Update and Cancel buttons, and hook them to the relevant commands using CommandName.

How to disable "Edit" button in Gridview?

Iam using Item Template field in my gridview to update the values inside particular column.
The ItemTemplate field contains "label" control and EditItemTemplate contains "DropDownList". Now the problem is I need to disable the "Edit" button based on the value of "Label"... Attached the lines of coding. Can anyone give me a solution.
Home.Aspx:
**********
<Columns>
<asp:BoundField DataField="Date" HeaderText="Date" ReadOnly="true" />
<asp:BoundField DataField="Type" HeaderText="Type" ReadOnly="true" />
<asp:BoundField DataField="Reason" HeaderText="Reason" ReadOnly="true" />
<asp:BoundField DataField="Request By" HeaderText="Request By" ReadOnly="true" />
<asp:TemplateField HeaderText="Status" HeaderStyle-HorizontalAlign="center">
<EditItemTemplate>
<asp:DropDownList ID="ddlState" AutoPostBack="false" runat="server">
<asp:ListItem Text="Approved" Value="Approved"> </asp:ListItem>
<asp:ListItem Text="Declined" Value="Declined"> </asp:ListItem>
<asp:ListItem Text="Pending" Value="Pending"> </asp:ListItem>
</asp:DropDownList>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="lblName" runat="server" Text='<%# Bind("Status") %>'></asp:Label>
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center"></HeaderStyle>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" />
</Columns>
Here in my coding "lblName" has the status value in ItemTemplate and "ddlState" has the status value in EditItemTemplate. Based upon the "lblName" value , "Edit" option has to be enabled...
Another approach is to use RowDataBound so you can use the value of Status directly. This assumes you are using a DataTable or other DataRow collection for your data source. The DataItem cast will need to be updated if you are using a different data type.
<asp:GridView ID="ExampleGridView" runat="server" OnRowDataBound="ExampleGridView_RowDataBound">
<Columns>
<asp:TemplateField HeaderText="Status" HeaderStyle-HorizontalAlign="center">
<EditItemTemplate>
<asp:DropDownList ID="StateDropDownList" AutoPostBack="false" runat="server">
<asp:ListItem Text="Approved" Value="Approved" />
<asp:ListItem Text="Declined" Value="Declined" />
<asp:ListItem Text="Pending" Value="Pending" />
</asp:DropDownList>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="NameLabel" runat="server" Text='<%# Bind("Status") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" />
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="EditButton" runat="server" CommandName="Edit" Text="Edit" Visible="true" />
</ItemTemplate>
<EditItemTemplate>
<asp:LinkButton ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
<asp:LinkButton ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
</EditItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
From code behind you can handle the row independently and have access to most of what is going on:
protected void ExampleGridView_RowDataBound(Object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow
&& (
e.Row.RowState == DataControlRowState.Alternate
|| e.Row.RowState == DataControlRowState.Normal
|| e.Row.RowState == DataControlRowState.Selected
))
{
Button EditButton = (Button)e.Row.FindControl("EditButton");
System.Data.DataRow dataRecord = (System.Data.DataRow)e.Row.DataItem;
if (EditButton != null && dataRecord != null)
{
if (dataRecord["Status"] == "ValueThatShowsEditButton")
{
EditButton.Visible = true;
}
}
}
}
Convert your Edit CommandField to a TemplateField.
In the newly-generated Button, add the following markup:
Enabled='<%# IsEditEnabled(Eval("Status")) %>'
In your code-behind, create a new method:
protected bool IsEditEnabled(string statusValue)
{
// Here is where you determine the value
}
Let me know how that works for you.

Linkbutton's event in GridView not firing its event on 2nd Time

Seems to be a weird problem but my Linkbutton which is in GridView is not firing its event on 2nd Time.
In Detail:
I have a GridView which has linkButton in it which is firing an event. This event is fired perfectly on first time but not working(not posting back) when i click it on 2nd time.
<asp:GridView ID="dg1" runat="server" OnSorting="dg1_Sorting" OnRowCreated="GridViewSortImages"
SkinID="grid" Width="100%" Font-Underline="false" HeaderStyle-Font-Underline="false"
OnRowCommand="dg1_RowCommand" AllowPaging="True" HeaderStyle-HorizontalAlign="Left"
OnRowDataBound="dg1_RowDataBound" ShowFooter="true">
<Columns>
<asp:TemplateField ItemStyle-Width="15px">
<ItemTemplate>
<asp:ImageButton ID="imgbtndel" runat="server" OnClick="imgbtndel_Click" ImageUrl="~/css/Images/delete.gif"
OnClientClick="return confirm('Do you want to Delete')"></asp:ImageButton>
</ItemTemplate>
<ItemStyle Width="15px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Account Type ID" SortExpression="ID" ItemStyle-Width="60px"
HeaderStyle-Font-Underline="false">
<ItemTemplate>
<asp:LinkButton ID="lnkbtnno" runat="server" ForeColor="#123B61" Text='<%#Eval("ID") %>'
OnClick="lnkbtnno_Click"></asp:LinkButton>
</ItemTemplate>
<HeaderStyle Font-Underline="False" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Description" SortExpression="Description" ItemStyle-Width="200px">
<ItemTemplate>
<asp:Label ID="lblDesc" runat="server" Text='<%#Eval("Description") %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="200px" />
<HeaderStyle HorizontalAlign="Left" />
</asp:TemplateField>
</Columns>
</asp:GridView>
C#
protected void lnkbtnno_Click(object sender, EventArgs e)
{
LinkButton lnkbtn = sender as LinkButton;
txtaccid.Text = lnkbtn.Text;
Label lblDesc = lnkbtn.FindControl("lblDesc") as Label;
txtdesc.Text = lblDesc.Text;
}
your linkbutton not firing events for second time.Because some other events got fired in second time instead of your linkbutton. So in events stack linkbutton events got disabled. Checkit out whether you added dynamic control are firing or not. Make use developer tools like firebug(F12)

Could not Update Text box control values

I am really frustrated to find a solution for my scenario. I have two gird when First grid is used show the shop information and the second grid is used to edit the offers related to the shop information. When the users edit the second grid i will just update the text box values related to the grid selection row. in my code behind file i can see the data fetching from the grid and assigning into the text boxes but when the function call (imgEdit_click) finished the page does not show the values. Editing functionality can be done in many ways but my scenario is what i explained earlier . I have the checked page there is no Postback action has been called after the method I could not find the solution can anyone help me to figure it out.
Following are my source and code behind codes.
My design Source :
<div class="field">
<asp:TextBox ID="txtareaOfferDesc" runat="server" TextMode="MultiLine" ></asp:TextBox>
</div>
<div class="field">
<asp:TextBox ID="txtTimeStarts" runat="server" CssClass="textfield"></asp:TextBox>
<cc1:CalendarExtender
ID="CalendarExtender2"
runat="server"
TargetControlID="txtTimeStarts"
CssClass="CalendarCSS">
</cc1:CalendarExtender>
<div class="datefld">
<label class="name">Offer end date/time (optional)</label>
<div class="field">
<asp:TextBox ID="txtTimeEnd" runat="server" CssClass="textfield"></asp:TextBox>
<cc1:CalendarExtender ID="CalendarExtender4" runat="server" TargetControlID="txtTimeEnd"
CssClass="CalendarCSS">
</cc1:CalendarExtender> `
<asp:GridView ID="gvShopDeal" runat="server" AutoGenerateColumns="false"
CssClass="tblexistoffer" DataKeyNames="ShopID" AllowPaging="True"
AllowSorting="True">
<Columns>
<asp:TemplateField>
<HeaderTemplate >
<asp:CheckBox ID="chkHeader" runat="server" />
<asp:Label ID="lblSelectAll" Text="Select All" runat="server"></asp:Label>
</HeaderTemplate>
<ItemTemplate >
<asp:CheckBox ID="chkRow" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ShopID" HeaderStyle-Width="10%" HeaderText="Shop ID" />
<asp:BoundField DataField="ShopName" HeaderStyle-Width="40%" HeaderText="Shop Name" />
<asp:BoundField DataField="Street" HeaderStyle-Width="40%" HeaderText="Street" />
<asp:BoundField DataField="City" HeaderText ="City" />
</Columns>
</asp:GridView>
<asp:Button ID="btnCreateDeal" runat="server" Text="Create Offer"
CssClass="grnbtn" OnClientClick="return CheckDealValidation(this)" onclick="btnCreateDeal_Click"></asp:Button>
<asp:Button ID="btnDefCancel" runat="server" Text="Cancel" CssClass="greybtn"></asp:Button>
<asp:UpdatePanel ID="UpdateExistingOffer" runat="server">
<ContentTemplate>
<asp:GridView ID="gvExistingOffers" runat="server" CssClass="tblexistoffer"
AutoGenerateColumns="false" DataKeyNames="OfferID" AllowPaging="True"
AllowSorting="True">
<Columns>
<asp:BoundField DataField="OfferID" HeaderText="OfferID" />
<asp:BoundField DataField="Description" HeaderText="OfferName" />
<asp:BoundField DataField="Status" HeaderText="Status" />
<asp:BoundField DataField="OfferType" HeaderText="OfferType" />
<asp:BoundField DataField="StartDate" HeaderText="StartDate">
<ItemStyle CssClass="Hide" />
<HeaderStyle CssClass="Hide" />
</asp:BoundField>
<asp:BoundField DataField="EndDate" HeaderText="EndDate" >
<ItemStyle CssClass="Hide" />
<HeaderStyle CssClass="Hide" />
</asp:BoundField>
<asp:TemplateField HeaderText="Edit" HeaderStyle-Width="5%">
<ItemTemplate>
<asp:ImageButton ID="imgbtnEdit" ImageUrl="~/Merchant/images/edit.jpg" runat="server" Width="25" Height="25" onclick="imgbtnEdit_Click" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
Code Behind File :
protected void imgbtnEdit_Click(object sender, ImageClickEventArgs e)
{
ImageButton btndetails = sender as ImageButton;
GridViewRow gvrow = (GridViewRow)btndetails.NamingContainer;
fferIDForShop = Convert.ToInt32(gvExistingOffers.DataKeys[gvrow.RowIndex].Value);
ShopList objShopID = ShopService.GetShopID(OfferIDForShop);
(txtareaOfferDesc.Text) = gvrow.Cells[1].Text.Trim();
txtTimeStarts.Text = gvrow.Cells[4].Text;
txtTimeEnd.Text = gvrow.Cells[5].Text;
}
Thanks
Vijay
Issue is because textboxes are out of Update Panel, So just put everything in update panel it will start functioning or just comment out update panel and then try the same thing.

keeping GridView checkbox state when posting back

I have a GridView which with a CheckBox in a TemplateField.
When I check something and hit the submit button, the items that I have checked are not check on the postback.
I tried using EnableViewState and that did not help.
How can this be fixed?
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:TemplateField HeaderText="SELECT">
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server"/>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ICAO" HeaderText="ICAO" />
<asp:BoundField DataField="IATA" HeaderText="IATA" />
<asp:BoundField DataField="AIRPORT_NAME" HeaderText="AIRPORT NAME" />
<asp:BoundField DataField="CITY" HeaderText="CITY" />
<asp:BoundField DataField="COUNTRY" HeaderText="COUNTRY" />
<asp:BoundField DataField="REVISED_DATE" HeaderText="REVISED DATE" />
<asp:BoundField DataField="EMAIL_DATE" HeaderText="EMAIL DATE" />
</Columns>
</asp:GridView>
You need to override LoadViewState and SaveViewState methods to maintain the selection.
https://web.archive.org/web/20211020153240/https://www.4guysfromrolla.com/articles/110205-1.aspx#postadlink

Resources