Develop Reference

Update Progress not working inside Gridview in Asp.Net

I want to show PreLoader on button click inside Gridview.
But it is not working as expected .
<asp:GridView ID="gv_deparment" runat="server" AutoGenerateColumns="false" OnRowCommand="gvPurchaseInvoiceEntry_RowCommand"
AllowSorting="True" AllowPaging="True" OnPageIndexChanging="gv_deparment_PageIndexChanging" OnSorting="gv_deparment_Sorting"
HeaderStyle-Font-Bold="false" CssClass="gvstyling gridview_width_100" ShowHeaderWhenEmpty="true" EmptyDataText="Record(s) Not Found!">
<Columns>
<asp:BoundField
DataField="department"
HeaderText="Department"
SortExpression="department" />
<asp:TemplateField HeaderText="Status" ItemStyle-Width="10">
<ItemTemplate>
<asp:UpdatePanel ID="UpdatePanel3" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<asp:LinkButton ID="btnUpdate" runat="server" CommandName="cmdUpdate"><i class="fa fa-edit"></i> Update </asp:LinkButton>
<asp:HiddenField ID="hf_departmnt" Value='<%# Eval("department_id")%>' runat="server" />
<asp:CheckBox ID="ck_departmnt" OnCheckedChanged="ck_departmnt_CheckedChanged" AutoPostBack="true" runat="server" Checked='<%# Eval("isactive") %>' />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnUpdate" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Update Message" ItemStyle-Width="200">
<ItemTemplate>
<asp:UpdateProgress ID="UpdateProgressdf1" runat="server" ClientIDMode="AutoID" Visible="true">
<ProgressTemplate>
<img src="../img/spinner-mini.gif" />
Please Wait...
</ProgressTemplate>
</asp:UpdateProgress>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
This is the problem that I am facing.
On single button click, only preloader besides the button should be display.
Here is the Image
But unfortunately all the preloader are displaying on single button click.
Any help will be appreciated

I think cause is you are not setting AssociatedUpdatePanelID . This link might help http://msdn.microsoft.com/en-us/library/bb386421%28v=vs.100%29.aspx

Hover menu on Nested Gridview

I have a Gridview. Inside I have a nested Gridview. I am using a javascript for expand collapse. My problem is that when I am trying to add an ajax hover menu extender on nested gridview, the hover is not displayed.
My code:
<script type="text/javascript">
$("[src*=plus]").live("click", function () {
$(this).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(this).next().html() + "</td></tr>")
$(this).attr("src", "../minusbutton.png");
});
$("[src*=minus]").live("click", function () {
$(this).attr("src", "../plusbutton.png");
$(this).closest("tr").next().remove();
});
</script>
<asp:GridView ID="GridViewCustomers" runat="server" AllowPaging="True"
AutoGenerateColumns="False" DataKeyNames="CustomerID">
<Columns>
<asp:TemplateField HeaderText="CustomerID" InsertVisible="False"
SortExpression="lblCustomerID" Visible="False">
<ItemTemplate>
<asp:Label ID="lblCustomerID" runat="server"
Text='<%# Bind("CustomerID") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name"
SortExpression="Name" >
<ItemTemplate>
<asp:Label ID="Name" runat="server" Text='<%# Bind("Name") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<img alt = "" style="cursor: pointer" src="../plusbutton.png" />
<asp:Panel ID="pnlCustomersDetails" runat="server" Style="display: none">
<asp:GridView ID="mynestedGridView" runat="server"
AutoGenerateColumns="False"
DataKeyNames="DetailsID">
<Columns>
<asp:TemplateField Visible="false" HeaderText="DetailsID">
<ItemTemplate>
<asp:Label ID="lblDetailsID" runat="server" Text='<%# Bind("DetailsID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Details>
<ItemTemplate>
<asp:Label ID="lblDetails" runat="server" Text='<%# Bind("Details") %>'></asp:Label>
<br />
<asp:HoverMenuExtender ID="HoverMenuExtender1" runat="server" TargetControlID="lblDetails" PopupControlID="Panel2" PopupPosition="Center" OffsetX="0" OffsetY="0" PopDelay="50">
</asp:HoverMenuExtender>
<asp:Panel ID="Panel2" runat="server">
<asp:Button ID="Button1" runat="server" Text="Button"></asp:Button>
</asp:Panel>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</asp:Panel>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>

What does the code behind look like?
I found this tutorial extremely helpful when working on nested gridview elements:
http://www.aspsnippets.com/Articles/ASPNet-Nested-GridViews-GridView-inside-GridView-with-Expand-and-Collapse-feature.aspx

How to validate TextBox Withing GridView Footer using Validator control?

Can anyone please help me to validate Textbox within Footer of the GridView Control upon Clicking the Button
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"
DataKeyNames="Id" ShowFooter="true" onrowdatabound="GridView1_RowDataBound" >
<Columns>
<asp:TemplateField>
<HeaderTemplate>
Units
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txt_Units" runat="server" Text='<%# Eval("Units") %>' ToolTip="Enter Units"></asp:TextBox>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ReadOnly="true" Text="999999" Enabled="false" ID="txt_MaxUnits" runat="server"></asp:TextBox>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Cost
</HeaderTemplate>
<ItemTemplate>
<asp:TextBox ID="txt_Cost" runat="server" Text='<%# Eval("Cost") %>' ></asp:TextBox>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txt_MaxCost" runat="server"></asp:TextBox>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="Enter Integer Between 0 to 999998" ControlToValidate="txt_Units" ValidationExpression="^(0{0,5}[1-9]|0?[1-9][0-9]|[1-9][0-9][0-9]| [1-9][0-9][0-9][0-9]|[1-9][0-9][0-9][0-9][0-9]|[1-9][0-9][0-9][0-9][0-9][0-9])$" ValidationGroup="vld_Rows"></asp:RegularExpressionValidator>
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ErrorMessage="Enter Integer Between 0 to 999998" ControlToValidate="txt_Cost" ValidationExpression="^(0{0,5}[1-9]|0?[1-9][0-9]|[1-9][0-9][0-9]| [1-9][0-9][0-9][0-9]|[1-9][0-9][0-9][0-9][0-9]|[1-9][0-9][0-9][0-9][0-9][0-9])$" Display="Dynamic" ValidationGroup="vld_Rows"></asp:RegularExpressionValidator>
</ItemTemplate>
<FooterTemplate>
<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ErrorMessage="Enter Integer Between 0 to 999998" ControlToValidate="txt_MaxCost" ValidationExpression="^(0{0,5}[1-9]|0?[1-9][0-9]|[1-9][0-9][0-9]| [1-9][0-9][0-9][0-9]|[1-9][0-9][0-9][0-9][0-9]|[1-9][0-9][0-9][0-9][0-9][0-9])$" ValidationGroup="vld_Rows1" ></asp:RegularExpressionValidator>
</FooterTemplate>
</asp:TemplateField>
<%--<asp:TemplateField>
<HeaderTemplate>
Is Max
</HeaderTemplate>
<ItemTemplate>--%>
<%-- <asp:TextBox ID="TextBox2" runat="server" Text='<%# Eval("IsMax") %>'></asp:TextBox>--%>
<%-- <asp:CheckBox ID="CheckBox1" runat="server" Checked='<%# Eval("IsMax") %>' OnCheckedChanged="CheckBox1_CheckedChanged" AutoPostBack="true" />
</ItemTemplate>
</asp:TemplateField>--%>
</Columns>
</asp:GridView>
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" ValidationGroup="vld_Rows" />
<asp:Button ID="btn_Save" runat="server" Text="Save" onclick="btn_Save_Click" ValidationGroup="vld_Rows1" />
</ContentTemplate>
<%--<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" runat="server" />
<asp:AsyncPostBackTrigger ControlID="CheckBox1" EventName="CheckedChanged" runat="server" />
</Triggers>--%>
</asp:UpdatePanel>
Above is the Sample Code Which I have used. Upon Clicking Button(btn_Save) I need to validate the ValidateGroup with id as "vld_Rows1"
Please Suggest a Solution.
Thanks in Advance!

Put the validation control in the same template where you put your control. In your scenario, your controls are in the footer template, so you should put the validation controls in footer template, and try to use validation group as well. e.g.
<asp:TemplateField>
<ItemTemplate>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox><asp:RequiredFieldValidator
ID="RequiredFieldValidator1" runat="server" ValidationGroup="ft" ControlToValidate="TextBox3"
ErrorMessage="*"></asp:RequiredFieldValidator>
</FooterTemplate>
</asp:TemplateField>

Checkout the following MSDN article: RegularExpressionValidator Control
From the article:
If the input control is empty, no validation functions are called and
validation succeeds. Use a RequiredFieldValidator control to prevent
the user from skipping an input control.
As it states you will need to make use of a RequiredFieldValidator to ensure that data has been entered.

make grid view auto scrollable

I have a grid. I have a button down that if i click on that button it will add an empty row to that grid in which i will edit and save. I need to display a scroll bar so that when i click on that button it will add empty row in the end of grid with scroll bar at the end
<div id="Div" runat="server" class="divFieldRow">
<div>
<center>
<div style="overflow: auto; height: 150px">
<asp:GridView ID="gvEventMechanic" runat="server" AutoGenerateColumns="False" PageSize="5"
GridLines="None" AllowSorting="true" BorderWidth="1"
BorderColor="Brown" AlternatingRowStyle-BackColor="Cyan" HeaderStyle-BackColor="ActiveCaption"
FooterStyle-BackColor="DimGray" EnableViewState="true" >
<Columns>
<asp:TemplateField>
<HeaderTemplate>
Disable
</HeaderTemplate>
<ItemStyle HorizontalAlign="Center" />
<ItemTemplate>
<asp:CheckBox ID="chkDelete" runat="server" AutoPostBack="true" OnCheckedChanged="cbDelete_OnCheckedChanged"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField >
<HeaderTemplate>Event</HeaderTemplate>
<ItemStyle HorizontalAlign="Center" />
<ItemTemplate>
<asp:Label ID="lblDesc" Visible='<%# ! IsInEditMode %>' runat="server" Text='<%# Eval("Description") %>' />
<asp:TextBox ID="txtDesc" Visible='<%# IsInEditMode %>' runat="server" Text='<%#Eval("Description")%>' MaxLength="255">
</asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</center>
</div>

Using a div that wraps the grid with fixed height and overflow should do the trick in case the table exceeds the fixed height. With paging involved you may switch to the last available page in the grid and rebind it, if that is what you want to achieve.

GridView paging in UpdatePanel

I have an UpdatePanel and a GridView within it. I have a problem with paging: when I press Next button, grdUsers_PageIndexChanging() is not called, so the page stays 1, and if previously I changed selection in ddlPageSize, now it goes back to the initial selection.
Also, if I am on the first page, the Previous button is not disabled, and pressing it causes Out Of Range error.
What am I doing wrong?
Thanks.
<asp:UpdatePanel ID="upnlUsers" runat="server" ChildrenAsTriggers="true" UpdateMode="Always" >
<ContentTemplate>
<div style="height:400px; width:1500px; overflow:auto;">
<asp:GridView ID="grdUsers" runat="server" AllowPaging="True" ShowHeader="false" ShowFooter="true"
AutoGenerateColumns="false" CssClass="largegridview largegridview_td"
Width="1480px" Height="100%" PageSize="100" DataKeyNames="ID" EnableSortingAndPagingCallbacks="false"
onpageindexchanging="grdUsers_PageIndexChanging"
onrowdatabound="grdUsers_RowDataBound">
<AlternatingRowStyle CssClass="alternatingrowstyle" />
<Columns>
<asp:TemplateField HeaderText="User Name" SortExpression="Name">
<ItemTemplate>
<asp:Label ID="lblName" runat="server" Text='<%# Eval("Name") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Last Name" SortExpression="LastName">
<ItemTemplate>
<asp:Label ID="lblLastName" runat="server" Text='<%# Eval("LastName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="First Name" SortExpression="FirstName">
<ItemTemplate>
<asp:Label ID="lblFirstName" runat="server" Text='<%# Eval("FirstName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Email" SortExpression="Email">
<ItemTemplate>
<asp:Label ID="lblEmail" runat="server" Text='<%# Eval("Email") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<PagerStyle CssClass="pagerstyle" />
<PagerTemplate>
<asp:Label ID="Label1" runat="server" Text="Show rows:" />
<asp:DropDownList ID="ddlPageSize" runat="server" AutoPostBack="true"
OnSelectedIndexChanged="ddlPageSize_SelectedIndexChanged">
<asp:ListItem Value="20" />
<asp:ListItem Value="50" />
<asp:ListItem Value="100" />
</asp:DropDownList>
Page
<asp:TextBox ID="txtGoToPage" runat="server" AutoPostBack="true"
OnTextChanged="GoToPage_TextChanged" CssClass="gotopage" />
of
<asp:Label ID="lblTotalNumberOfPages" runat="server" />
<asp:Button ID="btnPrev" runat="server" CommandName="Page"
ToolTip="Previous Page" CommandArgument="Prev" CssClass="previous" />
<asp:Button ID="btnNext" runat="server" CommandName="Page" ToolTip="Next Page"
CommandArgument="Next" CssClass="next" />
</PagerTemplate>
</asp:GridView>
</div>
</ContentTemplate>
</asp:UpdatePanel>

Agreed, I tested the code, and grdUsers_PageIndexChanging() is called on mine.

Dear Friend
their is in build paging in the gridview if you want your own paging style then you have to implement your own paging through PageDataSource Class.
Click to view code
this link provide you how to implement the paging in the Datalist and Repeater through same way you will implement the paging in grid view .
Then no pageindex change event will fired in the gridview.

I don't think you are doing anything wrong; it may not actually fire the PageIndexChanged event, it probably fires the RowCommand event. Attach to the ItemCommand event and that will receive the event.
HTH.