Dear Sir,
I am facing a challenge in gridview in asp.net. i have 50 rows in gridview and when I select 50th row for further process data is display in textbox but 50th row is not moving at top of table on position. Gridview is showing information from 1st to 50th again but 50th row again at down.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AtestGridViewSelectionAtTop.aspx.cs" Inherits="AtestGridViewSelectionAtTop" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<meta name="viewport" content="width = device-width, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 1.0, user-scalable = no" />
<%-- ============================ Start Script ====================================== --%>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<%-- Start Sweet Alert --%>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<%-- End Sweet Alert --%>
<%-- Start Date --%>
<link type="text/css" href="../Scripts/jquery-ui-1.8.19.custom.css" rel="stylesheet" />
<script src="../Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../Scripts/jquery-ui-1.8.19.custom.min.js"></script>
<%-- End Date --%>
<%-- Start GridView Scroll --%>
<script src="../GridViewScrollBothSide/jquery-1.9.1.min.js"></script>
<script src="../GridViewScrollBothSide/JavaScript.js"></script>
<script src="../GridViewScrollBothSide/GridViewScrollBothSide.js"></script>
<%-- End Grid View Script --%>
<%-- Start ListBox Sumo Select --%>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/5.3.2/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.sumoselect/3.4.9/jquery.sumoselect.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.sumoselect/3.4.9/sumoselect.min.css" rel="stylesheet" />
<%-- End ListBox Sumo Select --%>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>
<%-- Start Supplier List --%>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div class="container p-0 g-0">
<asp:Panel ID="PnlSearchSupplier" runat="server">
<div class="row p-0 g-0 bg_HeaderSub_Colour ">
<div class="col col-12 h-50 text-center fs-6 text-white">
Supplier List
</div>
</div>
</asp:Panel>
</div>
<div class="container p-0 g-0">
<asp:Panel ID="PnlSupplierList" runat="server">
<div class=" row p-0 g-0 ">
<div class="col col-12 text-black justify-content-center" >
<asp:GridView ID="GvSupplierList" runat="server" Font-Size="12px"
GridLines="Both" DataKeyNames="SupplierCode"
EmptyDataText="No Record Found"
EmptyDataRowStyle-ForeColor="Red"
EmptyDataRowStyle-Font-Bold="true"
EmptyDataRowStyle-BorderStyle="None"
CssClass=" MyDataGridViewListOne"
HorizontalAlign="Center" OnRowCommand="GvSupplierList_RowCommand"
AllowSorting="true"
RowStyle-CssClass="rows"
AutoGenerateColumns="false">
<EmptyDataRowStyle BorderStyle="None" Font-Bold="True" ForeColor="Red"></EmptyDataRowStyle>
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="Blue" Font-Names="Arial" Font-Size="12px" Font-Bold="True" ForeColor="White" />
<RowStyle CssClass="rows"></RowStyle>
<Columns>
<asp:TemplateField HeaderText="Sr.No" ItemStyle-Width="20px" ItemStyle-HorizontalAlign="Left">
<ItemTemplate>
<asp:Label ID="lblRowNumber"
Text='<%# Container.DataItemIndex + 1 %>'
runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Left" Width="30px" />
</asp:TemplateField>
<asp:TemplateField ItemStyle-HorizontalAlign="Center" HeaderText="Select">
<ItemTemplate>
<asp:Button ID="btnSelect" CssClass=" btn btn-sm btn-primary btn-outline-warning rounded-pill" runat="server"
Text="Select"
CommandArgument="<%#((GridViewRow)Container).RowIndex%>"
CommandName="SupplierDetail" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="SupplierCode"
HeaderText="Code"
ItemStyle-Wrap="false"></asp:BoundField>
<asp:BoundField DataField="SupplierName"
HeaderText="Name"
ItemStyle-Wrap="false"></asp:BoundField>
<asp:BoundField DataField="ContactPersonName"
HeaderText="Contact Person"
ItemStyle-Wrap="false"></asp:BoundField>
<asp:BoundField DataField="ContactPersonPhoneNo"
HeaderText="Contact No"
ItemStyle-Wrap="false"></asp:BoundField>
<asp:BoundField DataField="TinNo"
HeaderText="TinNo"
ItemStyle-Wrap="false"></asp:BoundField>
</Columns>
</asp:GridView>
</div>
</div>
</asp:Panel>
</div>
<div class="container p-0 g-0">
<asp:Panel ID="PnlSupplierDetail" runat="server">
<div class=" row p-0 g-0 bg_Entry_Color5 ">
<div class="col col-12 ">
<div class="row g-0 bg_HeaderSub_Colour text-center">
<asp:Label ID="Label22" CssClass=" text-black fs-6 " runat="server" Text="Supplier Information"></asp:Label>
</div>
<div class="row g-0 bg_Entry_Color2 ">
<div class=" col-2 p-1 text-start Fs-14-User text-danger border border-dark">
<asp:Label ID="Label6" runat="server" Text="Supplier Code"></asp:Label>
</div>
<div class=" col-2 p-1 text-start Fs-14-User border border-dark">
<asp:TextBox ID="TxtSupplierCode" ReadOnly="true" CssClass="w-100 h-auto text-uppercase" runat="server"
AutoCompleteType="Disabled"></asp:TextBox>
</div>
<div class=" col-2 p-1 text-start Fs-14-User text-danger border border-dark">
<asp:Label ID="Label5" runat="server" Text="Supplier Name"></asp:Label>
</div>
<div class=" col-6 p-1 text-start Fs-14-User border border-dark">
<asp:TextBox ID="TxtSupplierName" ReadOnly="true" CssClass="w-100 h-auto text-uppercase" runat="server"
AutoCompleteType="Disabled"></asp:TextBox>
</div>
</div>
</div>
</div>
</asp:Panel>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<%-- Start Supplier Detail --%>
</div>
</form>
<%-- ============================================= Start Script ====================================================== --%>
<%-- Start Script GridViewScroll Part List inside multiview mydatalistONE --%>
<script type="text/javascript">
//On Page Load.
$(function () {
ApplyGridviewScrollPluginOne();
});
//On UpdatePanel Refresh.
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
prm.add_endRequest(function (sender, e) {
if (sender._postBackSettings.panelsToUpdate != null) {
ApplyGridviewScrollPluginOne();
}
});
};
function ApplyGridviewScrollPluginOne() {
$('.MyDataGridViewListOne').gridviewScroll({
width: 1080,
freezesize: 4, // Freeze Number of Columns.
height: 250,
headerrowcount: 1, //Freeze Number of Rows with Header.
arrowsize: 30,
varrowtopimg: "../GridViewScrollBothSide/ImageScroll/arrowvt.png",
varrowbottomimg: "../GridViewScrollBothSide/ImageScroll/arrowvb.png",
harrowleftimg: "../GridViewScrollBothSide/ImageScroll/arrowhl.png",
harrowrightimg: "../GridViewScrollBothSide/ImageScroll/arrowhr.png"
});
}
</script>
</body>
</html>