datatables disappears after postback in ASP.NET WebForms
datatables disappears after postback in ASP.NET WebForms
Hi,
The most simplistic implementation of datatables plug-in works flawlessly on ASP.Net Gridview (Data connected @ backend). All the features run smoothly until a postback is made. With a button click as below or any other control. Than the datatables plug-in disappears. It reappears when we come back to the page. Has anyone experienced this as I havent found relevant post.
Any ideas appreciated!
Chris
[code]
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestJS.aspx.cs" Inherits="TestJS" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
$(document).ready(function() {
$('#gv').dataTable();
});
-----------------------------------------------------
Backend
-----------------------------------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication
{
public partial class TestJS : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
gv.DataSource = Domain.GetData();
gv.DataBind();
gv.HeaderRow.TableSection = TableRowSection.TableHeader;
}
}
protected void Button1_Click(object sender, EventArgs e)
{
}
}
}
[/code]
The most simplistic implementation of datatables plug-in works flawlessly on ASP.Net Gridview (Data connected @ backend). All the features run smoothly until a postback is made. With a button click as below or any other control. Than the datatables plug-in disappears. It reappears when we come back to the page. Has anyone experienced this as I havent found relevant post.
Any ideas appreciated!
Chris
[code]
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestJS.aspx.cs" Inherits="TestJS" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
$(document).ready(function() {
$('#gv').dataTable();
});
-----------------------------------------------------
Backend
-----------------------------------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication
{
public partial class TestJS : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
gv.DataSource = Domain.GetData();
gv.DataBind();
gv.HeaderRow.TableSection = TableRowSection.TableHeader;
}
}
protected void Button1_Click(object sender, EventArgs e)
{
}
}
}
[/code]
This discussion has been closed.
Replies
Looks Like ASP.NET GridView did not preserve thead section after postback, simple trick @ backend did the job:
Moving [code]gv.HeaderRow.TableSection = TableRowSection.TableHeader;[/code] line outside of !IsPostBack block
in the end working back end looks like this:
[code]-----------------------------------------------------
Backend
-----------------------------------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication
{
public partial class TestJS : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
gv.DataSource = Domain.GetData();
gv.DataBind();
}
gv.HeaderRow.TableSection = TableRowSection.TableHeader;
}
protected void Button1_Click(object sender, EventArgs e)
{
}
}
}
[/code]