Use DataTables on a ASP.NET GridView?

Use DataTables on a ASP.NET GridView?

autodafeautodafe Posts: 16Questions: 0Answers: 0
edited March 2012 in General
We have several GridView used in our project. We would like to apply DataTables to these GridView. Is it there a way toget the HTML from the GridView and pass it to DataTables?

Replies

  • allanallan Posts: 51,422Questions: 1Answers: 7,754 Site admin
    This thread might be of some interest to you: http://datatables.net/forums/discussion/8256 . There are a number of other discussions about GridView as well.

    Basically as long as it generates a TABLE with a TBODY and THEAD, then yes, you can use DataTables.

    Allan
  • jp_noronhajp_noronha Posts: 59Questions: 0Answers: 0
    Hi autodafe,

    i made a gridview class to deal with datatable, as soon as possible i will post it. still in the process of translating to english and making some examples to demonstrate.

    joao noronha
  • autodafeautodafe Posts: 16Questions: 0Answers: 0
    @allan
    thanks, I have seen that post

    @jp_noronha
    looking forward for your class and examples !!! if yiou wish to share it with me please contact me, I can give you my email address ;-)
  • autodafeautodafe Posts: 16Questions: 0Answers: 0
    so far I have got it "half-working"
    but only if I add:

    protected void Page_Load(object sender, EventArgs e)
    {
    GridView1.PreRender += new EventHandler(GridView1_PreRender);

    }

    void GridView1_PreRender(object sender, EventArgs e)
    {
    if (GridView1.Rows.Count > 0)
    {
    GridView1.UseAccessibleHeader = true;
    GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
    }
    }


    in the .cs file for the Page.
    It adds a "search box", formats rows, but still need to check sorting and other features....
  • jp_noronhajp_noronha Posts: 59Questions: 0Answers: 0
    use this:

    [code]
    ///
    /// Adds THeader e TBody tag to gridview
    ///
    /// the gridview
    public static void MakeAccessible(GridView grid)
    {
    if (grid.Rows.Count <= 0) return;
    grid.UseAccessibleHeader = true;
    grid.HeaderRow.TableSection = TableRowSection.TableHeader;
    if (grid.ShowFooter)
    grid.FooterRow.TableSection = TableRowSection.TableFooter;
    }
    [/code]

    call it like this:
    [code]
    protected override void OnPreRender(EventArgs e)
    {
    base.OnPreRender(e);

    MakeAccessible(objGridView);
    }
    [/code]
  • autodafeautodafe Posts: 16Questions: 0Answers: 0
    Sorry for my Very Long post (you can delete if you want)
    I got it working, it was a stupid error on my side (i was missing a "}" ) shame on me.... ;-)
  • autodafeautodafe Posts: 16Questions: 0Answers: 0
    this is the HTML I get from my DataGrid, it has THEAD and TBODY



     CodiceNomeLivelloProfiloTipologiaPerc. Part TimeData assunzioneData dimissioni 





    A05

    Alberto Bruni


    Liv 2

    Magazziniere/Assistente

    Collaboratore

    100


    27/12/2007








    A10

    Francesca Azzurri

    Liv 1


    Impiegato/Altro

    Dipendente

    100

    04/01/2011
















    Sorry if it's a bit too long....Copy/paste in JSBin WORKS (try it on http://live.datatables.net)



    But DataTables on my pages doesn't work at all

    i call it using simply:


    $(function () {
    $('#grdPersonale').dataTable();
  • mohammad_mcmohammad_mc Posts: 1Questions: 0Answers: 0
    first put this method on your page:

    [code]

    public static void MakeAccessible(GridView grid)
    {
    if (grid.Rows.Count <= 0) return;
    grid.UseAccessibleHeader = true;
    grid.HeaderRow.TableSection = TableRowSection.TableHeader;
    if (grid.ShowFooter)
    grid.FooterRow.TableSection = TableRowSection.TableFooter;
    }

    [/code]

    then use it on onrender event of gridview:

    [code]

    protected override void OnPreRender(EventArgs e)
    {
    base.OnPreRender(e);

    MakeAccessible(objGridView);
    }

    [/code]

    if you use master page the ID of gridview will change by the ASP.NET so datatable cant find your gridview by ID an all that you need to do is to set ClientIDMode attribute to static like this:
    [code]

    [/code]


    and finally write jquery function:

    [code]

    $(document).ready(function () { jQuery('#gv_show_groups').dataTable(); })

    [/code]

    hope this helps you :)
  • varaprasadreddyvaraprasadreddy Posts: 8Questions: 0Answers: 0
    Hi please look for ASP.Net GridView

    http://www.reddyinfosoft.blogspot.in/2012/12/jquery-datatable-plugin-in-aspnet-using_15.html

    and For ASP.Net Repeater

    http://www.reddyinfosoft.blogspot.in/2012/12/jquery-datatable-plugin-in-aspnet-using.html
  • gaffargaffar Posts: 2Questions: 0Answers: 0

    not working

  • gaffargaffar Posts: 2Questions: 0Answers: 0

    reddyinfosoft site went for long sleep

This discussion has been closed.