Hi @RAVI,
I tested your code. I think you want to avoid the postback and keep the filtered Gridview on the page when you click "Export".
Try using html buttons with type="button" added to avoid postbacks when clicked on export.
<button type="button" class="Excel" accesskey="R" tabindex="7" onclick='Export()' style="background-image: url(EmpImages/stars.JPG);background-color:transparent;border-color:transparent;border-style:dashed;border-width:1px;height:63px;width:65px" >Excel</button>
I'm not sure which js files you are using so I just use what I need. See my testing below for details.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>REPORT</title>
<script src="Scripts/jquery-3.4.1.min.js"></script>
<script src="Scripts/jquery-ui.js"></script>
<link href="Content/chosen.css" rel="stylesheet" />
<link href="Content/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function () {
$('#<%=gvDemo.ClientID%>').DataTable({
lengthMenu: [[1500, 1000, 500, 200, -1], [1500, 1000, 500, 250, 'All'],],
initComplete: function () {
this.api().columns("0").every(function () {
var column = this;
var select = $('<select style="width:130px;"><option value=""></option></select>').appendTo($("#Span1").empty())
.on('change', function () {
var val = $.fn.dataTable.util.escapeRegex($(this).val());
column.search(val ? '^' + val + '$' : '', true, false).draw();
});
column.data().unique().sort().each(function (d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});
});
this.api().columns("1").every(function () {
var column = this;
var select = $('<select style="width:230px;"><option value=""></option></select>').appendTo($("#Span2").empty())
.on('change', function () {
var val = $.fn.dataTable.util.escapeRegex($(this).val());
column.search(val ? '^' + val + '$' : '', true, false).draw();
});
column.data().unique().sort().each(function (d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});
});
this.api().columns("2").every(function () {
var column = this;
var select = $('<select style="width:130px;"><option value=""></option></select>')
.appendTo($("#Span3").empty()).on('change', function () {
var val = $.fn.dataTable.util.escapeRegex($(this).val());
column.search(val ? '^' + val + '$' : '', true, false).draw();
});
column.data().unique().sort().each(function (d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});
});
// end
}
});
});
</script>
<script type="text/javascript" language="javascript">
function calc() {
var sum1 = 0;
$('.cssSalary1').each(function () {
sum1 = sum1 + parseInt($(this).html());
});
$('.cssSum1').html(sum1);
//
var sum2 = 0; $('.cssSalary2').each(function () {
sum2 = sum2 + parseInt($(this).html());
});
$('.cssSum2').html(sum2);
}
</script>
<script>
$(function () {
$("#TextBox1").datepicker({
dateFormat: "dd-M-yy", minDate: new Date('2018/08/01'),
changeYear: true,
changeMonth: true, yearRange: '2018:2030', maxDate: "+0M +0D"
});
});
$(function () {
$("#TextBox2").datepicker({
dateFormat: "dd-M-yy",
minDate: new Date('2018/08/01'),
changeYear: true, changeMonth: true, yearRange: '2018:2030',
maxDate: "+0M +0D"
});
});
</script>
<style>
.SubTotalRowStyle {
border: solid 1px Black;
background-color: #FEEFBB;
font-weight: bold;
}
.GrandTotalRowStyle {
border: solid 1px Gray;
background-color: #000000;
color: #ffffff;
font-weight: bold;
}
.GroupHeaderStyle {
border: solid 1px Black;
background-color: #4682B4;
color: #ffffff;
font-weight: bold;
}
.serh-grid {
width: 85%;
border: 1px solid #6AB5FF;
background: #fff;
line-height: 14px;
font-size: 11px;
font-family: Verdana;
}
</style>
<script src="//cdn.rawgit.com/rainabba/jquery-table2excel/1.1.0/dist/jquery.table2excel.min.js"></script>
<script type="text/javascript">
function Export() {
$("[id*=gvDemo]").table2excel({
filename: "Leather_In_Out_Rpt.xls"
});
}
</script>
</head>
<body onload="calc()";>
<form id="form1" runat="server">
<div>
<table style="width: 283px">
<tr>
<td style="width: 86px; text-align: center">
<span style="font-size: 16pt; color: darkcyan; font-family: Calibri"><strong>REPORT</strong></span></td>
<td rowspan="1" style="width: 100px">
<asp:Button ID="Button1" runat="server" AccessKey="R" BackColor="Transparent" BorderColor="Transparent"
BorderStyle="Dashed" BorderWidth="1px" Font-Bold="True" Font-Names="Calibri"
Font-Size="10pt" ForeColor="#FFFFFF" Height="40px" OnClick="Button1_Click" Style="background-image: url(EmpImages/stars.JPG)"
Text="SEARCH" Width="94px" /></td>
<td rowspan="1" style="width: 100px">
<asp:Button ID="Button3" runat="server" AccessKey="R" BackColor="Transparent" BorderColor="Transparent"
BorderStyle="Dashed" BorderWidth="1px" Font-Bold="True" Font-Names="Calibri"
Font-Size="10pt"
ForeColor="#FFFFFF" Height="40px" OnClick="Button3_Click1" Style="background-image: url(EmpImages/stars.JPG)"
Text="REFRESH" Width="94px" /></td>
<td rowspan="1" style="width: 100px; text-align: center">
<button type="button" class="Excel" accesskey="R" tabindex="7" onclick='Export()' style="background-image: url(EmpImages/stars.JPG);background-color:transparent;border-color:transparent;border-style:dashed;border-width:1px;height:63px;width:65px" >Excel</button>
</td>
<td rowspan="1" style="width: 100px; text-align: center">
<asp:Button ID="Button5" runat="server" Font-Bold="True" Font-Names="Calibri" Font-Size="11pt"
ForeColor="#FFFFFF" Height="42px" OnClientClick="window.open('WebForm18.aspx', '_self');return false;"
Style="background-image: url(EmpImages/stars.JPG); background-color: transparent"
Text="HOME" Width="97px" /></td>
</tr>
</table>
<table>
<tr>
<td style="WIDTH: 100px; height: 31px;">
<span style="color: blue; font-family: Calibri"><strong>FILTER FILED 1</strong></span></td>
<td style="WIDTH: 100px; height: 31px;">
<span style="color: blue; font-family: Calibri"><strong>FILTER FILED 2</strong></span></td>
</tr>
<tr>
<td onchange="calc()"; style="WIDTH: 100px;font-size:12px; font-weight:bold;font-family:Calibri;color:Black;"> <span id="Span1"></span></td>
<td onchange="calc()"; style="WIDTH: 100px;font-size:12px; font-weight:bold;font-family:Calibri;color:Black;"> <span id="Span2"></span></td>
</tr>
</table>
<asp:GridView ID="gvDemo" runat="server" FooterStyle-HorizontalAlign="Right" AllowSorting="true" AutoGenerateColumns="false"
Font-Names="Calibri" Font-Size="11pt" Width="400px" OnRowDataBound="gvDemo_RowDataBound1" ShowFooter="True">
<Columns>
<asp:BoundField DataField="Field1" HeaderText="Field 1" >
<HeaderStyle BackColor="#69E8C4" />
</asp:BoundField>
<asp:BoundField DataField="Filed2" HeaderText="Filed 2" >
<HeaderStyle BackColor="#69E8C4" />
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:TemplateField HeaderText="Field 3">
<ItemTemplate>
<asp:Label ID="L2" Width="50px" CssClass="cssSalary1" ForeColor="blue" runat="server" Text='<%# Bind("Field3") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<span style="display:block; padding:0; text-align: right">
<asp:Label ID="FL2" Width="50px" Font-Bold="true" CssClass="cssSum1" runat="server" ForeColor="Black" ></asp:Label>
</span>
</FooterTemplate>
<HeaderStyle ForeColor="Black" Width="50px" BackColor="#69E8C4" />
<ControlStyle Width="50px" />
<ItemStyle HorizontalAlign="Right" Width="50px" />
<FooterStyle HorizontalAlign="Right" Width="50px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Field 4">
<ItemTemplate>
<asp:Label ID="L22" Width="50px" CssClass="cssSalary2" ForeColor="blue" runat="server" Text='<%# Bind("Field4") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<span style="display:block; padding:0; text-align: right">
<asp:Label ID="FL22" Width="50px" CssClass="cssSum2" Font-Bold="true" runat="server" ForeColor="Black" ></asp:Label>
</span>
</FooterTemplate>
<HeaderStyle ForeColor="Black" Width="50px" BackColor="#69E8C4" />
<ControlStyle Width="50px" />
<ItemStyle HorizontalAlign="Right" Width="50px" />
<FooterStyle HorizontalAlign="Right" />
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
Best regards,
Lan Huang
If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.