We Keep Coding

Set current tab active after file upload in jquery

I have 3 tabs, for which in second tab there is a file upload option. Currently what happening is after file upload completes the page refreshes and it goes to the first tab. But I want to stay in the current tab where the file was uploaded successfully.
HTML
<ul class="navTabs" role="tablist">
<li role="presentation" class="active"><i class="fa fa-info-circle" aria-hidden="true"></i>Vendor Data</li>
<li role="presentation"><i class="fa fa-download" aria-hidden="true"></i>Upload</li>
<li role="presentation"><i class="fa fa-cog" aria-hidden="true"></i>Configuration</li>
<span class="active-marker"></span>
</ul>
File upload HTML code
<div class="col-md-4">
<div class="form-group">
<asp:FileUpload ID="IPFEEBtn" class="form-control" runat="server" name="IPFEEBtn" />
</div>
</div>
<div class="col-md-6 filterButton">
<div class="form-group">
<asp:Button ID="UploadBtn" runat="server" Text="Upload" OnClick="UploadBtn_Click" CssClass="btn button" />
<asp:Button ID="IPFEEDownloadbtn" runat="server" Text="Download Format" OnClick="IPFEEDownloadbtn_Click" CssClass="btn button white" />
</div>
</div>
</div>
<!--end config-->
How to make it active in second tab after file upload?
UPDATE
<!--upload-->
<div id="c_upload" role="tabpanel" class="tabPane upload">
<div class="panelContent">
<div class="filter">
<div class="fLeft">
<div class="row">
<div class="col-md-4">
<div class="form-group">
<asp:FileUpload ID="IPFEEBtn" class="form-control" runat="server" name="IPFEEBtn" />
</div>
</div>
<div class="col-md-6 filterButton">
<div class="form-group">
<asp:Button ID="UploadBtn" runat="server" Text="Upload" OnClick="UploadBtn_Click" CssClass="btn button" />
<asp:Button ID="IPFEEDownloadbtn" runat="server" Text="Download Format" OnClick="IPFEEDownloadbtn_Click" CssClass="btn button white" />
</div>
</div>
</div>
</div>
<div class="fRight"></div>
</div>
<div class="datatableGrid">
<div class="dt_content">
<div class="dt_tables">
<div class="iptable table-responsive">
<asp:UpdatePanel ID="upNeInvReportGridView" runat="server">
<ContentTemplate>
<asp:GridView ID="grdStructId" EditRowStyle-Wrap="true" AutoGenerateColumns="false" AllowPaging="true" PageSize="5" CssClass="table dataTable dtTable table-bordered nowrap pageResize" runat="server"
>
<Columns>
<%--<asp:TemplateField HeaderText="ID">
<ItemTemplate>
<asp:Label ID="IPFEEId" Text='<%# Bind("ID") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>--%>
<asp:TemplateField HeaderText="SAP_ID">
<ItemTemplate>
<asp:Label ID="IPFEESAPID" Text='<%# Bind("SAP_ID") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="CITY">
<ItemTemplate>
<asp:Label ID="IPFEECITY" Text='<%# Bind("CITY") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="FINAL_SR_DATE">
<ItemTemplate>
<asp:Label ID="IPFEEFINALSRDATE" Text='<%# Bind("FINAL_SR_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="FINAL_SO_DATE">
<ItemTemplate>
<asp:Label ID="IPFEEFINALSODATE" Text='<%# Bind("FINAL_SO_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="INVOICE_DATE">
<ItemTemplate>
<asp:Label ID="IPFEEINVOICEDATE" Text='<%# Bind("INVOICE_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="IP_ID">
<ItemTemplate>
<asp:Label ID="IPFEEIPID" Text='<%# Bind("IP_ID") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="APPLICABLE_MSA">
<ItemTemplate>
<asp:Label ID="IPFEEAPPLICABLEMSA" Text='<%# Bind("APPLICABLE_MSA") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="SITE_CATEOGRY">
<ItemTemplate>
<asp:Label ID="IPFEESITECATEOGRY" Text='<%# Bind("SITE_CATEOGRY") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<%--<asp:TemplateField HeaderText="ID_OD">
<ItemTemplate>
<asp:Label ID="IPFEEIDOD" Text='<%# Bind("ID_OD") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>--%>
<asp:TemplateField HeaderText="ID_OD">
<ItemTemplate>
<asp:Label ID="IPFEEIDOD" Text='<%# Bind("ID_OD") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="RFI_DATE">
<ItemTemplate>
<asp:Label ID="IPFEERFIDATE" Text='<%# Bind("RFI_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="BILL_START_DATE">
<ItemTemplate>
<asp:Label ID="IPFEEBILLSTARTDATE" Text='<%# Bind("BILL_START_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="BILL_END_DATE">
<ItemTemplate>
<asp:Label ID="IPFEEBILLENDDATE" Text='<%# Bind("BILL_END_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="NO_OF_OPCO">
<ItemTemplate>
<asp:Label ID="IPFEENOOFOPCO" Text='<%# Bind("NO_OF_OPCO") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="ACTUAL_RENT_AMT">
<ItemTemplate>
<asp:Label ID="IPFEEACTUALRENTAMT" Text='<%# Bind("ACTUAL_RENT_AMT") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="TENURE">
<ItemTemplate>
<asp:Label ID="IPFEETENURE" Text='<%# Bind("TENURE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="GSM_ANTENNA_EXC_SAIL">
<ItemTemplate>
<asp:Label ID="IPFEEGSMANTENNAEXCSAIL" Text='<%# Bind("GSM_ANTENNA_EXC_SAIL") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="GSM_ANTENNA_NOTEXC_SAIL">
<ItemTemplate>
<asp:Label ID="IPFEEGSMANTENNANOTEXCSAIL" Text='<%# Bind("GSM_ANTENNA_NOTEXC_SAIL") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="REV_TOT_CNT_GSM_ANTENNA">
<ItemTemplate>
<asp:Label ID="IPFEEREVTOTCNTGSMANTENNA" Text='<%# Bind("REV_TOT_CNT_GSM_ANTENNA") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="MW_ANTENNA_OF_UPTO06_DIA">
<ItemTemplate>
<asp:Label ID="IPFEEMWANTENNAOFUPTO06DIA" Text='<%# Bind("MW_ANTENNA_OF_UPTO06_DIA") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="MW_ANTENNA_OF_12DIA">
<ItemTemplate>
<asp:Label ID="IPFEEMWANTENNAOF12DIA" Text='<%# Bind("MW_ANTENNA_OF_12DIA") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="MW_ANTENNA_OF_GREATER12_DIA">
<ItemTemplate>
<asp:Label ID="IPFEEMWANTENNAOFGREATER12DIA" Text='<%# Bind("MW_ANTENNA_OF_GREATER12_DIA") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="HEIGHT_OF_HEIGHEST_ANTENNA">
<ItemTemplate>
<asp:Label ID="IPFEEHEIGHTOFHEIGHESTANTENNA" Text='<%# Bind("HEIGHT_OF_HEIGHEST_ANTENNA") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="WEIGHT_OF_TOWER_TOP_BTS">
<ItemTemplate>
<asp:Label ID="IPFEEWEIGHTOFTOWERTOPBTS" Text='<%# Bind("WEIGHT_OF_TOWER_TOP_BTS") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="WIND_SPEED">
<ItemTemplate>
<asp:Label ID="IPFEEWINDSPEED" Text='<%# Bind("WIND_SPEED") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="POWER_RATING_OF_BTS">
<ItemTemplate>
<asp:Label ID="IPFEEPOWERRATINGOFBTS" Text='<%# Bind("POWER_RATING_OF_BTS") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="FLOOR_SPACE_INDOOR">
<ItemTemplate>
<asp:Label ID="IPFEEFLOORSPACEINDOOR" Text='<%# Bind("FLOOR_SPACE_INDOOR") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="FLOOR_SPACE_OUTDOOR">
<ItemTemplate>
<asp:Label ID="IPFEEFLOORSPACEOUTDOOR" Text='<%# Bind("FLOOR_SPACE_OUTDOOR") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="EB_STATUS_VALUE">
<ItemTemplate>
<asp:Label ID="IPFEEEBSTATUSVALUE" Text='<%# Bind("EB_STATUS_VALUE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="NO_OF_US">
<ItemTemplate>
<asp:Label ID="IPFEENOOFUS" Text='<%# Bind("NO_OF_US") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="HIGHER_RENT">
<ItemTemplate>
<asp:Label ID="IPFEHIGHERRENT" Text='<%# Bind("HIGHER_RENT") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="RRH_COUNT">
<ItemTemplate>
<asp:Label ID="IPFERRHCOUNT" Text='<%# Bind("RRH_COUNT") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="VOLUME_DISCOUNT">
<ItemTemplate>
<asp:Label ID="IPFEVOLUMEDISCOUNT" Text='<%# Bind("VOLUME_DISCOUNT") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="VENDOR_NAME">
<ItemTemplate>
<asp:Label ID="IPFEEVENDORNAME" Text='<%# Bind("VENDOR_NAME") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="CIRCLE">
<ItemTemplate>
<asp:Label ID="IPFEECIRCLE" Text='<%# Bind("CIRCLE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="APPLICABLE_SITE_RENT">
<ItemTemplate>
<asp:Label ID="IPFEEAPPLICABLESITERENT" Text='<%# Bind("APPLICABLE_SITE_RENT") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<%--<asp:TemplateField HeaderText="LAST_UPDATED_DATE">
<ItemTemplate>
<asp:Label ID="IPFEELASTUPDATEDDATE" Text='<%# Bind("LAST_UPDATED_DATE") %>' runat="server"></asp:Label>
</ItemTemplate>
</asp:TemplateField>--%>
</Columns>
<PagerStyle HorizontalAlign="right" CssClass="GridPager" />
<EditRowStyle Wrap="True" />
<EmptyDataTemplate>
No Record Found
</EmptyDataTemplate>
</asp:GridView>
</ContentTemplate>
<Triggers>
<%-- <asp:AsyncPostBackTrigger ControlID="bSearch" EventName="Click" />--%>
<asp:PostBackTrigger ControlID="bExportToExcel" />
<asp:PostBackTrigger ControlID="UploadBtn" />
</Triggers>
</asp:UpdatePanel>
</div>
</div>
<div class="dt_footer">
<asp:Button ID="bExportToExcel" runat="server" Text="Export To Excel" OnClick="bExportToExcel_Click" CssClass="btn button" />
</div>
</div>
</div>
</div>
</div>
<!--end upload-->

Based on the provided HTML and code, you can achieve this by JavaScript. Try the below code:
<script>
$(function () {
var elementObject = localStorage.getItem('active');
if (elementObject) {
var element = JSON.parse(elementObject);
$('.navTabs').children().removeClass("active");
$('.navTabs').children().eq(parseInt(element.index)).addClass('active');
window.location.hash = element.id;
}
});
$(document).on('click', '.navTabs li', function () {
debugger;
$('.navTabs li').removeClass("active");
$(this).addClass("active");
var obj = { index: $(this).index(), id: $(this).children()[0].rel };
localStorage.setItem('active', JSON.stringify(obj));
});
</script>
Explanation: On clicking the ul item we're saving the clicked one li element to an object with its id and on page load, we're retrieving it and setting it again to the previous/saved state.

javascript timer in gridview asp.net

In my product table i have a start date and end date. I want to show a countdown timer in my asp.net gridview such that when it expires it will show "Project Ended"
It is showing: But how do i remove hard coded date to pick the date from the sql database. Also, with the hard coded date it is only showing once in the first row of my gridview table.
This is the aspx page:
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" CssClass="Grid" AutoGenerateColumns="False" BackColor="White" BorderColor="#999999" BorderStyle="Solid" BorderWidth="1px" CellPadding="3" DataKeyNames="ProjectID" DataSourceID="SqlDataSource1" ForeColor="Black" PageSize="50" GridLines="Vertical">
<AlternatingRowStyle BackColor="#CCCCCC" />
<Columns>
<asp:TemplateField HeaderText="S/N" HeaderStyle-Width="100">
<ItemTemplate>
<%# Container.DataItemIndex + 1 %>
</ItemTemplate>
<HeaderStyle Width="100px"></HeaderStyle>
</asp:TemplateField>
<asp:TemplateField HeaderStyle-Width="100" ShowHeader="False">
<EditItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="True" CommandName="Update" Text="Update"></asp:LinkButton>
<asp:LinkButton ID="LinkButton3" runat="server" CausesValidation="False" CommandName="Cancel" Text="Cancel"></asp:LinkButton>
</EditItemTemplate>
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Edit" Text="Edit" CssClass="glyphicon-edit"></asp:LinkButton>
</ItemTemplate>
<HeaderStyle Width="100px"></HeaderStyle>
</asp:TemplateField>
<asp:TemplateField ShowHeader="false">
<ItemTemplate>
<asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Delete" Text="Delete"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ProjectID" HeaderText="ProjectID" InsertVisible="False" ReadOnly="True" SortExpression="ProjectID" />
<asp:TemplateField ItemStyle-HorizontalAlign="Left" HeaderText="Project Title" SortExpression="ProjectTitle">
<EditItemTemplate>
<asp:TextBox ID="projectT" runat="server" Text='<%#Bind("ProjectTitle")%>' Height="48px" TextMode="MultiLine" Width="735px"></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="ProjectTitle" runat="server" Text='<%#Bind("ProjectTitle") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="StartDate" ItemStyle-HorizontalAlign="Left" HeaderText="StartDate" DataFormatString="{0:dd/MM/yyyy}" HtmlEncode="false" SortExpression="StartDate" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="EndDate" ItemStyle-HorizontalAlign="Left" HeaderText="EndDate" DataFormatString="{0:dd/MM/yyyy}" HtmlEncode="false" SortExpression="EndDate" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Duration" ItemStyle-HorizontalAlign="Left" HeaderText="Duration" SortExpression="Duration" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="ProjectCost" ItemStyle-HorizontalAlign="Left" HeaderText="ProjectCost" HtmlEncode="False" DataFormatString="{0:N}" SortExpression="ProjectCost" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="Currency" ItemStyle-HorizontalAlign="Left" HeaderText="Currency" SortExpression="Currency" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="PercentageOfCompletion" ItemStyle-HorizontalAlign="Left" HeaderText="% of Completion" HtmlEncode="False" DataFormatString="{0:P}" SortExpression="PercentageOfCompletion" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:BoundField DataField="PhaseType" ItemStyle-HorizontalAlign="Left" HeaderText="PhaseType" SortExpression="PhaseType" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:TemplateField HeaderText="Type" SortExpression="Type">
<ItemTemplate>
<asp:Label ID="Type" runat="server" Text='<%# Bind("Type") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="ProjectTypeID" runat="server" SelectedValue='<%# Bind("ProjectTypeID") %>' DataTextField="Type" DataValueField="ProjectTypeID" DataSourceID="SqlDataSource2"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="State" SortExpression="StateName">
<ItemTemplate>
<asp:Label ID="StateName" runat="server" Text='<%# Bind("StateName") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="StateID" runat="server" SelectedValue='<%# Bind("StateID") %>' DataTextField="StateName" DataValueField="StateID" DataSourceID="SqlDataSource3"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="LGA" SortExpression="LGName">
<ItemTemplate>
<asp:Label ID="LGName" runat="server" Text='<%# Bind("LGName") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="LGAID" runat="server" SelectedValue='<%# Bind("LGAID") %>' DataTextField="LGName" DataValueField="LGAID" DataSourceID="SqlDataSource4"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Community" SortExpression="CommunityName">
<ItemTemplate>
<asp:Label ID="CommunityName" runat="server" Text='<%# Bind("CommunityName") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="CommunityID" runat="server" SelectedValue='<%# Bind("CommunityID") %>' DataTextField="CommunityName" DataValueField="CommunityID" DataSourceID="SqlDataSource5"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Company" SortExpression="CompanyName">
<ItemTemplate>
<asp:Label ID="CompanyName" runat="server" Text='<%# Bind("CompanyName") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="CoyID" runat="server" SelectedValue='<%# Bind("CoyID") %>' DataTextField="CompanyName" DataValueField="CoyID" DataSourceID="SqlDataSource6"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Contractor" SortExpression="Company">
<ItemTemplate>
<asp:Label ID="Company" runat="server" Text='<%# Bind("Company") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="ContractorID" runat="server" SelectedValue='<%# Bind("ContractorID") %>' DataTextField="Company" DataValueField="ContractorID" DataSourceID="SqlDataSource7"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Status" SortExpression="Status">
<ItemTemplate>
<asp:Label ID="Status" runat="server" Text='<%# Bind("Status") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="ProjectStatusID" runat="server" SelectedValue='<%# Bind("ProjectStatusID") %>' DataTextField="Status" DataValueField="ProjectStatusID" DataSourceID="SqlDataSource8"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Year" SortExpression="Year">
<ItemTemplate>
<asp:Label ID="Year" runat="server" Text='<%# Bind("Year") %>'></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList ID="YearID" runat="server" SelectedValue='<%# Bind("YearID") %>' DataTextField="Year" DataValueField="YearID" DataSourceID="SqlDataSource9"></asp:DropDownList>
</EditItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ProjectExistence" ItemStyle-HorizontalAlign="Left" HeaderText="Proj Existence" SortExpression="ProjectExistence" >
<ItemStyle HorizontalAlign="Left"></ItemStyle>
</asp:BoundField>
<asp:TemplateField ItemStyle-HorizontalAlign="Left" HeaderText="Project Relevance" SortExpression="ProjectRelevance">
<EditItemTemplate>
<asp:TextBox ID="projectrelevance" runat="server" Text='<%#Bind("ProjectRelevance")%>' Height="204px" TextMode="MultiLine" Width="735px"></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="ProjectRelevance" runat="server" Text='<%#Bind("ProjectRelevance") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField ItemStyle-HorizontalAlign="Left" HeaderText="Remarks" SortExpression="Remarks">
<EditItemTemplate>
<asp:TextBox ID="remark" runat="server" Text='<%#Bind("Remarks")%>' Height="204px" TextMode="MultiLine" Width="735px"></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="remark01" runat="server" Text='<%#Bind("Remarks") %>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="CountDown">
<ItemTemplate>
<div id="myCountdownClass"><%# !string.IsNullOrEmpty(Eval("EndDate").ToString()) ? Convert.ToDateTime(Eval("EndDate")).ToString("MM'/'dd'/'yyyy") : "" %></div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
This is my script:
<script>
// Set the date we're counting down to
var countDownDate = new Date("Oct 5, 2017 15:37:25").getTime();
// Update the count down every 1 second
var x = setInterval(function () {
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// Display the result in the element with id="demo"
document.getElementById("myCountdownClass").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";
// If the count down is finished, write some text
if (distance < 0) {
clearInterval(x);
document.getElementById("myCountdownClass").innerHTML = "PROJECT ENDED";
}
}, 1000);
</script>

Here is a quick demo of how to create a countdown timer in a GridView. Use a TemplateField and place the correct date in a div. Add a class to that div so you can reference it in jQuery.
<asp:TemplateField>
<ItemTemplate>
<div class="myCountdownClass"><%# Convert.ToDateTime(Eval("myDate")).ToString("MM'/'dd'/'yyyy") %></div>
</ItemTemplate>
</asp:TemplateField>
And the jQuery function
<script type="text/javascript">
$('.myCountdownClass').each(function () {
var date = $(this).text();
$(this).countdown(date, function (event) {
$(this).text(event.strftime('%D days %H:%M:%S'));
});
});
</script>
This demo uses this as the countdown timer: http://hilios.github.io/jQuery.countdown/
UPDATE
To prevent errors when converting to datetime when the database value is null, use a ternary operator.
<%# !string.IsNullOrEmpty(Eval("myDate").ToString()) ? Convert.ToDateTime(Eval("myDate")).ToString("MM'/'dd'/'yyyy") : "" %>
UPDATE 2
<script type="text/javascript" src="/jquery.countdown.min.js"></script>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<div class="myCountdownClass"><%# Convert.ToDateTime(Eval("myDate")).ToString("MM'/'dd'/'yyyy") %></div>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<%# Convert.ToDateTime(Eval("myDate")).ToString("MM'/'dd'/'yyyy") %>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<script type="text/javascript">
$('.myCountdownClass').each(function () {
var date = $(this).text();
$(this).countdown(date, function (event) {
$(this).text(event.strftime('%D days %H:%M:%S'));
});
});
</script>

Not able to get values of textbox and label using asp.net and jquery from aspgrid (dynamic)

I have following grid
<asp:GridView ID="grdBOQ" width="100%" ShowHeaderWhenEmpty="true" AutoGenerateColumns="false" runat="server" CssClass="gvBOQdatatable">
<Columns>
<asp:TemplateField HeaderText="Sl No:">
<ItemTemplate>
<%#(grdBOQ.PageSize * grdBOQ.PageIndex) + grdBOQ.Rows.Count + 1%>
</ItemTemplate>
<HeaderStyle HorizontalAlign="Center" Width="40px" Wrap="False" />
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Category Name">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("Category_Name") %>' ID="lblCategoryName" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Category Description">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("Description") %>' ID="lblCategoryDescription" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Quantity">
<ItemTemplate>
<asp:TextBox ID="txtQuantity" class="form-control" runat="server" Text="0" MaxLength="8"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("UOM_Name") %>' ID="lblUnit" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit Rate">
<ItemTemplate>
<asp:Label runat="server" Text='<%# Bind("SellingPrice_Per_UOM") %>' ID="lblUnitRate" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Total">
<ItemTemplate>
<asp:Label runat="server" Text='0.00' ID="lblTotalPrice" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EmptyDataTemplate>
<div style="width: 99%; text-align: center">
<asp:Label ID="lblEmpty" runat="server" Text="Sorry!!! No Record Found.."></asp:Label>
</div>
</EmptyDataTemplate>
</asp:GridView>
I have given following code in script tag using jquery to find asp textbox value but not working. I tried 2 different way but not getting.
First way
$("#txtQuantity").on('click', function () {
alert('testing');
});
Second Way
var recipient = $("#txtQuantity")
$("#<%=recipient.ClientID%>").on('change', function () {
alert('testing');
});
Nothing works what is the way to get. I tried the above code inside document.ready and inside aspcontent tag.As it is in grid I have now around 5 textboxes and it varies based on the values from database.

Finally I have some thing like this but no idea this is a good solution.Please advice
$("#<%=grdBOQ.ClientID %>").on('change', function () {
var GridView1 = document.getElementById('<%= grdBOQ.ClientID %>');
for (var rowId = 1; rowId < GridView1.rows.length; rowId++) {
var textValue = GridView1.rows[rowId].cells[3].children[0];
if (textValue.value != '0')
alert(textValue.value);
}
});

Warning Error on Datatable with My Gridview

Here is my code using jQuery Datatable
<script type="text/javascript">
$(function () {
$("#<%=grdEmployee.ClientID%>").dataTable();
})
</script>
Here is My GridView Code
<asp:GridView ID="grdEmployee" runat="server" PageSize="5" AutoGenerateColumns="false" OnPageIndexChanging="grdEmployee_PageIndexChanging" AllowPaging="true" AllowSorting="true">
<Columns>
<asp:TemplateField HeaderText="Emp ID" SortExpression="Emp ID">
<ItemTemplate>
<asp:Label ID="lblEmpID" runat="server" Text='<%#Eval("Empid") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Emp Name" SortExpression="Emp Name">
<ItemTemplate>
<asp:Label ID="lblEmpName" runat="server" Text='<%#Eval("EmpName") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Emp Salary" SortExpression="Emp Salary">
<ItemTemplate>
<asp:Label ID="lblEmpSalary" runat="server" Text='<%#Eval("Salary") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Edit">
<ItemTemplate>
<asp:LinkButton ID="lnkEdit" runat="server" Text="Edit" CommandArgument='<%#Eval("Empid") %>' CommandName="eEdit"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Delete">
<ItemTemplate>
<asp:LinkButton ID="lnkDelete" runat="server" Text="Delete" CommandArgument='<%#Eval("Empid") %>' CommandName="eDelete"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
When I set GridView page size property to 5, it will give me a data table warning.
My database has 9 records and when I change the pagesize value from 5 to 10, it will not return any warning.

How to enable and disable the LinkButton in GridView when CheckBox in the same GridView was checked?

I have a number of Template Fields in my GridView. In which I have One CheckBox called "chkSelect" in it and in another Template Field I have one LinkButton called "lnkgvQCAttribute". Here I want to Disable the LinkButton when the CheckBox is Unchecked and Enable the LinkButton when the CheckBox is Checked. How to do this using JavaScript?
Here is my GridView's columns:
<Columns>
<asp:TemplateField HeaderText="S.No.">
<ItemTemplate>
<asp:Label ID="lblSNo" runat="server" Text='<%# Container.DataItemIndex + 1 %>'></asp:Label>
</ItemTemplate>
<ItemStyle Width="25px" />
<ControlStyle Width="25px" />
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' onClick="CheckedTotal();" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" />
</HeaderTemplate>
<ControlStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
<asp:BoundField DataField="PurchaseID" HeaderText="PurchaseID" Visible="false" />
<asp:BoundField DataField="POID" HeaderText="POID" Visible="false" />
<asp:BoundField DataField="PurchaseDetailID" HeaderText="PurchaseDetailID" Visible="false" />
<asp:TemplateField HeaderText="ItemID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblgvItemID" runat="server" Text='<%# Bind("ItemID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Item Description" SortExpression="ItemDescription">
<ItemTemplate>
<asp:Label ID="lblItemDesc" runat="server" Text='<%# Bind("ItemDescription") %>' Style="display: none"></asp:Label>
<asp:TextBox ID="txtItemDesc" runat="server" Text='<%# Bind("ItemDescription") %>' Font-Size="Smaller" Enabled="false"></asp:TextBox>
</ItemTemplate>
<ControlStyle Width="200px" />
<ItemStyle Width="200px" />
</asp:TemplateField>
<asp:BoundField DataField="SpecificationName" HeaderText="Specification Name" SortExpression="SpecificationName">
<ItemStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:TemplateField HeaderText="RD">
<ItemTemplate>
<asp:Label ID="lblgvRD" runat="server" Text='<%# Bind("RandomDimension") %>'></asp:Label></ItemTemplate>
<ItemStyle Width="40px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Planned Quantity" SortExpression="PlannedQuantity">
<ItemTemplate>
<asp:Label ID="lblPlannedQuantity" runat="server" Text='<%# Bind("PlannedQuantity") %>' />
<asp:TextBox ID="txtPlannedQuantity" runat="server" Style="display: none" Text='<%# Bind("PlannedQuantity") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="OnOrder Quantity" SortExpression="OnOrderQuantity">
<ItemTemplate>
<asp:Label ID="lblOnOrderQuantity" runat="server" Text='<%# Bind("OnOrderQuantity") %>' />
<asp:TextBox ID="txtOnOrderQuantity" runat="server" Style="display: none" Text='<%# Bind("OnOrderQuantity") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Order Quantity" SortExpression="OrderQuantity">
<ItemTemplate>
<asp:TextBox ID="txtOrderQuantity" runat="server" MaxLength="10" onkeypress="return DecimalValidate(event);" onkeyup="return calculateTotal();" Text='<%# Bind("OrderQuantity") %>' Enabled="false" />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Unit Rate" SortExpression="UnitRate">
<ItemTemplate>
<asp:Label ID="lblUnitRate" runat="server" Style="display: none" Text='<%# Bind("UnitRate") %>' />
<asp:TextBox ID="txtUnitRate" runat="server" onkeypress="return DecimalValidate(event);" onkeyup="return calculateTotal();" Text='<%# Bind("UnitRate") %>' Enabled="false />
</ItemTemplate>
<ControlStyle Width="90%" />
<ItemStyle Width="80px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Total Amount" SortExpression="TotalAmount">
<ItemTemplate>
<asp:TextBox ID="txtTotalAmt" runat="server" contentEditable="false" onclick="this.blur();" Style="background-color: Transparent; border: 0px; cursor: default" Text='<%# Bind("TotalAmount") %>' />
</ItemTemplate>
<ControlStyle Width="60px" />
<ItemStyle Width="60px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="ItemStatusID" Visible="false">
<ItemTemplate>
<asp:Label ID="lblgvItemStatusID" runat="server" Text='<%# Bind("ItemStatusID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="QC">
<ItemTemplate>
<asp:LinkButton ID="lnkgvQCAttribute" runat="server" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>' CommandName="QC" Text="QC" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
Please I need all your suggestions...

First add a reference to jQuery (download it and put it in one of site-folders, for example Scripts):
<script src="Scripts/jquery-1.2.6.pack.js" type="text/javascript"></script>
Then you should create a CssClass name for your elements, like:
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" Checked='<%#Bind("Select") %>' CssClass="chkSelect" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="chkSelectAll" runat="server" onclick="CheckAll();" />
</HeaderTemplate>
<ControlStyle Width="20px" />
<ItemStyle Width="20px" />
</asp:TemplateField>
and
<asp:TemplateField HeaderText="QC">
<ItemTemplate>
<asp:LinkButton ID="lnkgvQCAttribute" runat="server" CommandArgument='<%# DataBinder.Eval(Container, "RowIndex") %>'
CommandName="QC" Text="QC" CssClass="lnkgvQCAttribute" />
</ItemTemplate>
</asp:TemplateField>
Now, you can find your elements with JS and control their behavior. In this case, the checkbox is in a span, then in a td, and finally a tr. You should navigate to the tr, in the tr find the a element that have lnkgvQCAttribute class, and control it:
<script type="text/javascript">
$(document).ready(function () {
$("span.chkSelect input").click(function () {
var enabled = this.checked;
var link = $(this).parent().parent().parent().find("a.lnkgvQCAttribute");
if (enabled) {
var href = $(link).attr("data-href");
$(link).attr("href", href);
$(link).removeAttr("data-href");
} else {
var href = $(link).attr("href");
$(link).attr("data-href", href);
$(link).removeAttr("href");
}
});
});
</script>
Enjoy!

Call onclick="disableLinkButton(this)" on checkbox
function disableLinkButton(obj) {
var rowObject = getParentRow(obj);
if(obj.checked) {
rowObject.childNodes[3].disabled = true // debug and check, row Object will contain that link button as its childnodes
}
else {
rowObject.childNodes[3].disabled = false;
}
}
function getParentRow(obj) {
obj = obj.parentElement;
while(obj.tagName != "TR")
return obj;
}

Add following javascript and style onto the page:
<script type="text/javascript">
$(function () {
$("input[id*='chkSelect_']", "#<%= GridView1.ClientID %>")
.click(function () {
var linkButton = $(this).closest("tr").find("a[id*='lnkgvQCAttribute_']");
if (this.checked) {
EnableLinkButton(linkButton);
}
else {
DisableLinkButton(linkButton);
}
}) //disable turned off linkbuttons on page load
.not(":checked").each(function () {
DisableLinkButton($(this).closest("tr").find("a[id*='lnkgvQCAttribute_']"));
});
});
function EnableLinkButton(lb) {
$(lb)
.removeClass("disabled")
.attr("href", function () {
return !$(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('retun false;', '__doPostBack') : this.href;
});
}
function DisableLinkButton(lb) {
$(lb)
.addClass("disabled")
.attr("href", function () { return $(this).is("[href^='javascript:__doPostBack']") ? this.href.replace('__doPostBack', 'retun false;') : this.href; });
}
</script>
<style type="text/css">
a.disabled
{
color: #e3e3e3;
text-decoration: none;
cursor: default;
}
</style>