button gridview in UpdatePanel - asp.net

i use gridview and UpdatePanel in asp.net.
<asp:UpdatePanel ID="upSubject" runat="server">
<ContentTemplate>
<div class="c_box" style="height: auto; text-align: center; margin-top: 10px; width:565px; padding-right:140px;">
<asp:GridView ID="gvSubject" runat="server" AutoGenerateColumns="False"
SkinID="gvSubject" ShowHeader="true" ShowHeaderWhenEmpty="true"
onrowcommand="gvSubject_RowCommand">
<Columns>
<asp:BoundField DataField="lblCounter" HeaderText="Number" ReadOnly="True" HeaderStyle-Font-Bold="false" ItemStyle-Width="60px"></asp:BoundField>
<asp:BoundField DataField="lblSubject" HeaderText="Tiltle" ReadOnly="True" HeaderStyle-Font-Bold="false" ItemStyle-Width="300px" ItemStyle-HorizontalAlign="Right"></asp:BoundField>
<asp:TemplateField HeaderText="Delete" ItemStyle-HorizontalAlign="Center" HeaderStyle-Font-Bold="false" ItemStyle-Width="60px">
<ItemTemplate>
<asp:ImageButton ID="dltSubject" runat="server" CommandName="remove" CommandArgument="lblCounter" ValidationGroup="Subject" OnClientClick="return confirm('Delete?')" ImageUrl="~/Style/Pic/pic_delete_small.png" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle BackColor="#000000" />
<EmptyDataRowStyle BackColor="#00ff00" />
<EmptyDataTemplate>
Not item...
</EmptyDataTemplate>
</asp:GridView>
</div>
</ContentTemplate>
<Triggers>
<asp:asyncpostbacktrigger controlid="gvSubject" eventname="RowCommand" />
</Triggers>
</asp:UpdatePanel>
or
<asp:asyncpostbacktrigger controlid="dltSubject" eventname="Click" />
.
protected void gvSubject_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "remove")
{
DataTable _dt = (DataTable)Session["Subject"];
_dt.Rows[int.Parse(e.CommandArgument.ToString())].Delete();
gvSubject.DataSource = _dt;
gvSubject.DataBind();
Session["Subject"] = _dt;
}
}
but not work UpdatePanel. please help me for work button gridview in UpdatePanel.
i want work ImageButton in gridview and UpdatePanel.

You dont have to use Triggers for the RowCommand. Also remove rowcommand if you dont want to use besides this button click.
Please specify OnCommand=dtlSubject_Click
I have used here "Number" as commandargument thinking that it is your unique id needed to delete the record.
You need to specify unique column for deletion in commandargument.
<asp:ImageButton ID="dltSubject" runat="server"
CommandArgument='<%#DataBinder.Eval(Container.DataItem, "Number")%>'
ValidationGroup="Subject" OnCommand="dtlSubject_Click"
OnClientClick="return confirm('Delete?')" ImageUrl="~/Style/Pic/pic_delete_small.png" />
And on server side write down following code :
protected void dtlSubject_Click(object sender, CommandEventArgs e)
{
string uniqueid= e.CommandArgument.ToString();
//call your procedure here to delete your item.
}

Related

Updatepanel trigger postback in gridview

I have the next gridview:
<asp:UpdatePanel ID="upCustomer" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnCustomerSearch" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="gvPersons" EventName="PageIndexChanging" />
</Triggers>
<ContentTemplate>
<asp:TextBox ID="txtCode" runat="server" />
<asp:Button ID="btnCustomerSearch" runat="server" Text="Search" OnClick="btnCustomerSearch_Click" />
<asp:GridView ID="gvPersons" runat="server" AutoGenerateColumns="False" AllowPaging="True"
PageSize="10" GridLines="Vertical" EmptyDataText="No results"
ShowHeaderWhenEmpty="True" OnRowDataBound="gvPersons_RowDataBound"
OnPageIndexChanging="gvPersons_PageIndexChanging"
onselectedindexchanging="gvPersons_SelectedIndexChanging">
<Columns>
<asp:BoundField DataField="Personid" />
<asp:BoundField DataField="Name" HeaderText="Nombre" />
<asp:BoundField DataField="Phone" HeaderText="Telefono" />
<asp:BoundField DataField="Email" HeaderText="Email" />
</Columns>
<PagerSettings Mode="NumericFirstLast" Position="TopAndBottom" />
</asp:GridView>
</ContentTemplate>
I need the next funcionality:
When I click btnCustomerSearch, I want an Ajax update (works)
When I click pagination, I want an Ajax update (works)
When I click a row (gvPersons_SelectedIndexChanging), I want a postback update, but this doesnt work.
Is posible to get an asyncpostback in some events in a gridview and postback in anothers?
Insert a Button inside your update panel and define a PostBackTrigger for it
<asp:UpdatePanel ID="upCustomer" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<Triggers>
...
<asp:PostBackTrigger ControlID="PostBackButton" />
</Triggers>
<ContentTemplate>
...
<asp:Button ID="PostBackButton" runat="server" Text="Button" OnClick="PostBackButton_Click" />
</ContentTemplate>
</asp:UpdatePanel>
Insert a TemplateField on your grid like this
<Columns>
<asp:TemplateField>
<ItemTemplate>
<input type="button" onclick="javascript:__doPostBack('<%= PostBackButton.ClientID %>',<%# ((GridViewRow)Container).RowIndex %>)" value="Select" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
When the user clicks on any button inside the grid, we will have to manually fire the Click event of the PostBackButton passing the RowIndex as argument.
On the server side
protected void PostBackButton_Click(object sender, EventArgs e)
{
string argument = Request.Form["__EVENTARGUMENT"];
gvPersons.SelectedIndex = Convert.ToInt32(argument);
}
Now we just have to hide the PostBackButton...
protected void Page_Load(object sender, EventArgs e)
{
// ...
PostBackButton.Style.Add("display", "none");
}
...and disable the event validation of the page, otherwise we will get an ArgumentException when the user selects a row
<%# Page Language="C#" ... EnableEventValidation="false" %>
Yes. It is possible.
As stated here, you can try this
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnCustomerSearch" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="gvPersons" EventName="PageIndexChanging" />
<asp:PostBackTrigger ControlID="gvPersons" EventName="SelectedIndexChanging" />
</Triggers>

Finding out which button was clicked in a SelectedIndexChanged event handler of a GridView

We have a GridView that contains 2 "Select" buttons for each row that is displayed in the GridView.
We would like to know if there is a way to find out which of the 2 buttons was clicked on by using the SelectedIndexChanged handler.
This coding shows the buttons we have:
<asp:UpdatePanel
ID="UpdatePanelParentsSummary"
runat="server"
UpdateMode="Conditional">
<ContentTemplate>
<p>Parent Search:
<asp:TextBox
ID="TextBoxSearch"
runat="server"
Width="207px"
Text="ALL"> </asp:TextBox>
<asp:Button
ID="ButtonSearch"
runat="server"
Text="Search" />
<asp:Button
ID="ButtonSearchAll"
runat="server"
Text="Show ALL Parents" />
<br />
</p>
<asp:GridView
ID="GridViewParentsSummary"
runat="server"
AllowPaging="True"
AllowSorting="True"
AutoGenerateColumns="False"
DataKeyNames="ID"
>
<Columns>
<asp:BoundField
DataField="ID"
HeaderText="ID"
SortExpression="ID" InsertVisible="False" ReadOnly="True" Visible="False" />
<asp:BoundField
DataField="FatherName"
HeaderText="FatherName"
SortExpression="FatherName" />
<asp:BoundField DataField="MotherName" HeaderText="MotherName"
SortExpression="MotherName" />
<asp:ButtonField
ButtonType="Button"
CommandName="Select"
Text="Select Details" />
<asp:ButtonField
ButtonType="Button"
CommandName="Select"
Text="New Person To Release Child" />
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
This is the code in the SelectedIndexChanged handler:
Protected Sub GridViewParentsSummary_SelectedIndexChanged(sender As Object, e As EventArgs) Handles GridViewParentsSummary.SelectedIndexChanged
IntParentsID = GridViewParentsSummary.DataKeys(GridViewParentsSummary.SelectedIndex).Value
Response.Redirect("AuthorizationForChildReleaseDetails.aspx")
End Sub
Ah, there is a simple solution to this problem. Your sender is the button clicked. Just try something like:
ButtonField buttonClicked = sender as ButtonField;
if (buttonClicked != null) {
String commandName = buttonClicked.CommandName;
if (commandName.equals("Command1") {
... do something awesome ...
} else if (commandName.equals("Command2")) {
... do something less awesome ...
}
}
I don't think you can differentiate between the source at the GridView event level because it is an event raised by the GridView at that point which is masking the lower level event. You can, however, implement a row level handler to identify which button was used to raise the event and set it up somewhere for use in the gridview event.
protected void GridView_RowCommand(object sender, CommandEventArgs e)
{
e.CommandArgument ....contains the argument name
....
}

DataBind GridView OnKeyUp/Down

I have a gridview that will display customer information. I want it to update the results as the user types first and/or last name into the textboxes. Basically, to databind the gridview to it's datasource with the updated characters from the textboxes as the user types.
CODE EDITED:
<%# Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Process.aspx.cs" Inherits="Reservations.WebForm3" %>
<asp:UpdateProgress ID="UpdateProgress1" runat="server"
AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>Processing...</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="firstname" runat ="server" class="inputLarge" ontextchanged="firstname_TextChanged" />
<asp:TextBox ID="lastname" runat="server" class="inputLarge" />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" Width="457px">
<Columns>
<asp:TemplateField>
<EditItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</EditItemTemplate>
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:BoundField DataField="CustID" HeaderText="Cust ID">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="FirstName" HeaderText="First Name">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="LastName" HeaderText="Last Name">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="City" HeaderText="City">
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
</Columns>
</asp:GridView>
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts></Scripts>
</asp:ScriptManager>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="firstname" EventName="TextChanged" />
</Triggers>
</asp:UpdatePanel>
protected void firstname_TextChanged(object sender, EventArgs e)
{
InventoryAppSoapClient inst = new InventoryAppSoapClient();
DataSet ds = inst.getCustomer(firstname.Text, "none");
GridView1.DataSource = ds;
GridView1.DataBind();
}
Everything works except the TextChanged event only first the first time. If I go back and change the text and tab off, nothing happens.
Have you tried adding an event handler for the OnTextChanged event of your text box.
Inside you could force the databind like so
Private void firstName_OnTextChanged(object sender, EventArgs e)
{
//Your datasource and parameters are already defined on the front end so there is no
//setup required
existing.DataBind();
}
Same goes for your text box lastName
Private void lastName_OnTextChanged(object sender, EventArgs e)
{
//Your datasource and parameters are already defined on the front end so there is no
//setup required
existing.DataBind();
}
And don't forget to add the methods to the OnTextChange attribute for each textbox in the front end. Like so.
<asp:TextBox ID="firstname" OnTextChanged="firstName_OnTextChanged" runat ="server" class="inputLarge"/>
<asp:TextBox ID="lastname" OnTextChanged="lastName_OnTextChanged" runat="server" class="inputLarge" />
Also, if you embed this code in an update Panel and use the AJAX control toolkit (free) the grid will update seamlessly. Otherwise it won't be pretty if you use classic asp techniques. The page will keep posting back every time you press a key. It will get annoying.

Delete from GridView in ModalpopupExtender

I have a ModalPopupExtender which is, among other things, populated with a gridview (From a DataTable).
In this GridView I have a deletebutton attached to each row, which is supposed to delete the row. Is it anyway possible to delete the selected row from the datatable, and then update the GridView without closing the ModalPopupExtender?
Here is my GridView:
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" PopupDragHandleControlID="divPopupReport" TargetControlID="btnHidden" PopupControlID="divPopupReport" CancelControlID="btnCloseReport" BackgroundCssClass="modalBackground"></ajaxToolkit:ModalPopupExtender>
<asp:UpdatePanel runat="server" ID="upReport">
<ContentTemplate>
<div id="divPopupReport" runat="server" style="text-align:left; padding-right:0px; background-color:White; border: 2px solid #87d000; display:none;" >
<asp:GridView ID="GridView2" runat="server" CssClass="list listExtended"
DataKeyNames="DocumentGuid" Width="100%" OnRowCommand="GridView2_RowCommand" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="DocumentName" HeaderText="Dokumentname">
<ItemStyle CssClass="list"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="CardName" HeaderText="Reference">
<ItemStyle CssClass="list"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="DocumentDate" HeaderText="Date">
<ItemStyle CssClass="list"></ItemStyle>
</asp:BoundField>
<asp:TemplateField HeaderText="">
<ItemStyle CssClass="list" />
<ItemTemplate>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="">
<ItemStyle CssClass="list" />
<ItemTemplate>
<asp:ImageButton ID="btnDelete" CssClass="image" runat="server" CommandName="Delete" CommandArgument='<%# Eval("DocumentGuid") %>' ImageUrl="~/delete.gif" Width="16" Height="16" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</ContentTemplate>
</asp:UpdatePanel>
And below my RowCommand.
protected void GridView2_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "Delete")
{
DataTable SelectedDataTable = Session["SelectedDataTable"] as DataTable;
string guid = Convert.ToString(e.CommandArgument);
DataRow[] dr = SelectedDataTable.Select("DocumentGuid = '" + guid + "'");
SelectedDataTable.Rows.Remove(dr[0]);
Session["SelectedDataTable"] = SelectedDataTable;
GridView2.DataSource = SelectedDataTable;
GridView2.DataBind();
}
}
You need to wrap an UpdatePanel around the grid. This should solve the problem.
Another option is to use ajax.
Using Javascript/JQuery to remove the table row manually in combination with a WebMethod:
http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/
Another easy solution is to re-show the popup after post back.
Swap upReport panel with divPopupReport div (i.e. place upReport UpdatePanel into divPopupReport div).

can't run on RowCommand in Gridview?

I have a gridview in my web page. I a linkbutton column. The commandName of the linkbutton column is "lbtnedit", I want When i click the linkbutton another tab will show detail of Resume by loading ID, but when i click linkbutton it don't run into gvresume_OnRowCommand
Thanks in advance !
Here my Grid:
<asp:UpdatePanel ID="udpsubtabResumeList" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<div class="settingrow">
<div class="gSDMS_Grid">
<asp:GridView ID="gridViewResume" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" Width="100%"
AllowPaging="true" AllowSorting="true" AutoGenerateColumns="false" PageSize="10" PagerSettings-Position="Bottom" PagerStyle-HorizontalAlign="Right"
CssClass="css_grid" OnItemCommand="gvresume_OnRowCommand" EnableViewState="true"
>
<AlternatingRowStyle CssClass='AlternatingRowStyle' />
<EditRowStyle CssClass='EditRowStyle' />
<FooterStyle CssClass='FooterStyle' />
<HeaderStyle CssClass='HeaderStyle' />
<PagerStyle CssClass='PagerStyle' HorizontalAlign="Right" />
<RowStyle CssClass='RowStyle' />
<SelectedRowStyle CssClass='SelectedRowStyle' />
<Columns>
<asp:TemplateField HeaderText="Full Name" ItemStyle-CssClass="txt" SortExpression="Fullname">
<ItemTemplate><%#Eval("Fullname")%></ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="View" ItemStyle-CssClass="edit-del accept" ItemStyle-HorizontalAlign="Center">
<ItemTemplate><a class="edit" href='<%# "/FutureEmployee/PostResume.aspx?&id=" + Eval("ResumeID") %>' title="Detail"> </a>
</ItemTemplate></asp:TemplateField>
<asp:TemplateField HeaderText="Edit" ItemStyle-CssClass="edit-del accept">
<ItemTemplate><asp:LinkButton runat="server" ID="lbtnedit" Text="Edit" CommandName="edit_cmd" CommandArgument='<% #Eval("ResumeID") %>'></asp:LinkButton>
</ItemTemplate></asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
Here is event
protected void gvresume_OnRowCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName=="edit_cmd")
{
_id = new Guid(e.CommandArgument.ToString());
Response.Redirect(SiteRoot + "/FutureEmployee/EmployeeTab.aspx#subTabViewResume");
}
}
Edit one:
when i use firebug here is content in link:
href="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$aaaaaaa$bbbbbbbbbbb", ""false, "",";Clients.aspx", false, true)
I think it fine if : javascript:__doPostBack('ctl00$mainContent$gridViewResume','resumeID') but i don't know how to do this ?
Asp:GridView hasn't event OnItemCommand.
You should use OnRowCommand and change signature of handler:
protected void gvresume_OnRowCommand(Object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "edit_cmd")
{
}
}
I solved proplem by remove all validate in my page.

Resources