How to export grid data to excel?

Question

guys i need help how to export grid data to excel..this is simple i did export button click .what i did in click event is correct becuse  i used that code previous its working code..

 

but here iam binding grid view data using jquery..so if i apply export button iam not getting data in excel because data is empty ..how we export data plz tell me 

<script type="text/javascript">

$(function () {

var isChecked = $("#RightContents_ChkIsReleaved").is(":checked");

if (isChecked) {

// alert("CheckBox checked.");

GetReleavedEmployees(1);

} else {

//alert("CheckBox un checked.");

GetCustomers(1);

}

});

$("[id*=txtSearch]").live("keyup", function () {

var ischecked = $("#RightContents_ChkIsReleaved").is(":checked");

if (ischecked) {

GetReleavedEmployees(parseInt(1));

} else {

GetCustomers(parseInt(1));

}

// GetCustomers(parseInt(1));

});

$(".Pager .page").live("click", function () {

var ischecked = $("#RightContents_ChkIsReleaved").is(":checked");

if (ischecked) {

// alert("checkbox checked phani.");

GetReleavedEmployees(parseInt($(this).attr('page')));

} else {

// alert("checkbox un checked phani.");

GetCustomers(parseInt($(this).attr('page')));

}

// GetCustomers(parseInt($(this).attr('page')));

});

function SearchTerm() {

return jQuery.trim($("[id*=txtSearch]").val());

};

function GetCustomers(pageIndex) {

var ColumnName = $('#<%=ddlSearchColumn.ClientID %>').val();

$.ajax({

type: "POST",

url: "EmployeeDirectory.aspx/GetCustomers",

data: '{searchTerm: "' + SearchTerm() + '", pageIndex: ' + pageIndex + ',Column:"' + ColumnName + '" }',

contentType: "application/json; charset=utf-8",

dataType: "json",

success: OnSuccess,

failure: function (response) {

alert(response.d);

},

error: function (response) {

alert(response.d);

}

});

}

function GetReleavedEmployees(pageIndex) {

var ColumnName = $('#<%=ddlSearchColumn.ClientID %>').val();

$.ajax({

type: "POST",

url: "EmployeeDirectory.aspx/GetReleavedEmployees",

data: '{searchTerm: "' + SearchTerm() + '", pageIndex: ' + pageIndex + ',Column:"' + ColumnName + '" }',

contentType: "application/json; charset=utf-8",

dataType: "json",

success: OnSuccess,

failure: function (response) {

alert(response.d);

},

error: function (response) {

alert(response.d);

}

});

}

var row;

function OnSuccess(response) {

var xmlDoc = $.parseXML(response.d);

var xml = $(xmlDoc);

var customers = xml.find("Customers");

if (row == null) {

row = $("[id*=gvCustomers] tr:last-child").clone(true);

}

$("[id*=gvCustomers] tr").not($("[id*=gvCustomers] tr:first-child")).remove();

if (customers.length > 0) {

$.each(customers, function () {

var customer = $(this);

$("td", row).eq(0).html("<a href='EmployeeProfile.aspx?id=" + $(this).find("EmpId").text() + "'>" + $(this).find("EmployeeCode").text() + "</a>");

$("td", row).eq(1).html($(this).find("Name").text());

$("td", row).eq(2).html($(this).find("DateOfJoining").text());

$("td", row).eq(3).html($(this).find("EmpStatus").text());

$("td", row).eq(4).html($(this).find("Mobile").text());

$("td", row).eq(5).html($(this).find("email").text());

$("[id*=gvCustomers]").append(row);

row = $("[id*=gvCustomers] tr:last-child").clone(true);

});

var pager = xml.find("Pager");

$(".Pager").ASPSnippets_Pager({

ActiveCssClass: "current",

PagerCssClass: "pager",

PageIndex: parseInt(pager.find("PageIndex").text()),

PageSize: parseInt(pager.find("PageSize").text()),

RecordCount: parseInt(pager.find("RecordCount").text())

});

var searchFiled = $('#<%=ddlSearchColumn.ClientID %>').val();

searchFiled = ".JS" + searchFiled;

$(searchFiled).each(function () {

var searchPattern = new RegExp('(' + SearchTerm() + ')', 'ig');

$(this).html($(this).text().replace(searchPattern, "<span class = 'highlight'>" + SearchTerm() + "</span>"));

});

} else {

var empty_row = row.clone(true);

$("td:first-child", empty_row).attr("colspan", $("td", row).length);

$("td:first-child", empty_row).attr("align", "center");

$("td:first-child", empty_row).html("No records found for the search criteria.");

$("td", empty_row).not($("td:first-child", empty_row)).remove();

$("[id*=gvCustomers]").append(empty_row);

}

};

</script>

<div>

<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="Server" />

</div>

<asp:UpdatePanel runat="server" ID="Homesettings" UpdateMode="Always">

<ContentTemplate>

<asp:CheckBox ID="ChkIsReleaved" CssClass="contnavbut" OnCheckedChanged="chkd_CheckedChanged" AutoPostBack="true" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

<div>

<span style="float: left; width: 70%">Search:&nbsp;&nbsp;<asp:DropDownList runat="server" ID="ddlSearchColumn" CssClass="CSSddlColumnName" BackColor="#6D6767">

<asp:ListItem Value="Name">Employee Name</asp:ListItem>

<asp:ListItem Value="Code">Employee Code</asp:ListItem>

<asp:ListItem Value="DOJ">Date Of Joining</asp:ListItem>

<asp:ListItem Value="Status">Status</asp:ListItem>

<asp:ListItem Value="Mobile">Phone</asp:ListItem>

<asp:ListItem Value="email">Email</asp:ListItem>

</asp:DropDownList>

<asp:TextBox ID="txtSearch" runat="server" CssClass="CSStxtSearch" /></span>

<table style="border: 1px solid">

<tr>

<td>Current Head Count</td>

<td>

<asp:Label ID="lblActiveEmp" runat="server" Text=""></asp:Label></td>

</tr>

<tr>

<td>Releaved Employees</td>

<td>

<asp:Label ID="lblReleavedEmp" runat="server" Text=""></asp:Label>

</td>

</tr>

<%-- <tr>

<td>Total</td>

<td>--%>

<asp:Label ID="lblTotalEmp" runat="server" Text="" Visible="false"></asp:Label><%--</td>

</tr>--%>

</table>

</div>

<div style="float: right; font-weight: bold;"></div>

<asp:Button runat="server" CssClass="divBTN floatright" ID="export" OnClick="export_Click" Text="Export" />

<div><asp:Label ID="lblsmsg" runat="server" CssClass="lbl" Text="Subscription limit exceeded. Please contact administrator!" ForeColor="Red" Visible="false"></asp:Label></div>

<hr style="width: 100%;" />

<asp:UpdatePanel runat="server" ID="updgvcustomers" >

<ContentTemplate>

<asp:GridView ID="gvCustomers" runat="server" AutoGenerateColumns="false" CssClass="responsive" AlternatingRowStyle-BackColor="#E2E9EB" Width="100%" HeaderStyle-CssClass="gridHeaderEmp">

<Columns>

<asp:BoundField HeaderStyle-Width="150px" DataField="EmployeeCode" HeaderText="EmployeeCode" ItemStyle-CssClass="JSCode" />

<asp:BoundField HeaderStyle-Width="150px" DataField="Name" HeaderText="Employee Name" ItemStyle-CssClass="JSName" />

<asp:BoundField DataField="DateOfJoining" HeaderText="Date Of Joining" ItemStyle-CssClass="JSDOJ" />

<asp:BoundField DataField="EmpStatus" HeaderText="Status" ItemStyle-CssClass="JSStatus" />

<asp:BoundField DataField="Mobile" HeaderText="Phone" ItemStyle-CssClass="JSMobile" />

<asp:BoundField HeaderStyle-Width="150px" DataField="email" HeaderText="Email" ItemStyle-CssClass="JSemail" />

</Columns>

</asp:GridView>

</ContentTemplate>

</asp:UpdatePanel>

.........................................................................................

 

public override void VerifyRenderingInServerForm(Control control)

{

return;

//base.VerifyRenderingInServerForm(control);

}

 

protected void export_Click(object sender, EventArgs e)

{

StringWriter sw = new StringWriter();

HtmlTextWriter hw = new HtmlTextWriter(sw);

gvCustomers.RenderControl(hw);

UBL.CreateExcel(sw.ToString(), "EmpDirectory.xls");

Response.Clear();

}