C# - Táblázat azonnali megjelenítése

forráskód letöltése
Nagyméretű táblázatoknál gondot okoz, hogy a böngészők csak akkor jelenítik meg, ha már a teljes táblázat letöltésre került. Internet Explorer lehetőségünk van arra, hogy a táblázatot azonnal megjelenítsük, folyamatosan már a letöltés közben is. Ennek következtében nagyméretű táblázatoknál is már azonnal megjelennek a táblázat azon sorai, melyek már letöltésre kerültek.
Mellékelt példa megnyitása előtt szükséges egy FastTable nevű virtuális könyvtár létrehozása, mely a példa könyvtárára mutat. Ehhez nyissa meg a mellékelt mappa Tulajdonság ablakát és itt a Webmegosztás lapon engedélyezze a mappa megosztását olvasási és parancsfájlok futtatási jogával.
Nézzük, milyen beállításokat kell megtennünk ahhoz egy DataGrid kontrol esetén, hogy a bevezetőben leírt hatást elérhessük.
Első lépésként létrehozzuk a táblázat tartalmát, mely 3000 sort tartalmaz. Ezt egy DataTable osztályba tesszük meg. Ez az adathalmaz már eléggé nagy lesz ahhoz, hogy a letöltéskor jelentős időt vegyen igénybe.
    private void Page_Load(object sender, System.EventArgs e)
    {
      if (!IsPostBack)
      {
        dt = new DataTable();
        dt.Columns.Add("First", Type.GetType("System.Int32"));
        dt.Columns.Add("Second", Type.GetType("System.String"));
        DataRow dr;
        for (int i=0; i<3000; i++)
        { 
          dr = dt.NewRow();
          dr[0] = i;
          dr[1] = DateTime.Now.AddDays(i).ToShortDateString();
          dt.Rows.Add(dr);
        }
A táblát eltároljuk a Cache-en annak érdekében, hogy a következő kéréskor már ne kelljen előállítani a tartalmat.
        Cache["DataTable"]=dt;
      }
      else
      {
        dt = (DataTable)Cache["DataTable"];
      }
Most, hogy a tartalom már rendelkezésre áll, hozzárendeljük a DataGrid1, illetve DataGrid2-höz, viszont csak a DataGrid1 esetében rendelkezünk arról, hogy a táblázat megjelenítése azonnal megkezdődjön, amint az adatok egy része letöltésre került. DataGrid2-nél ezt a lépést nem tesszük meg, így jól megfigyelhető lesz, hogy miközben a DataGrid1 táblázata már látható, a DataGrid2 táblázata csak akkor jelenik meg, mikor annak tartalma teljesen letöltésre került.
DataGrid1 esetében két dolgot kell megtennünk, hogy a táblázat azonnal megjelenítésre kerüljön. A <TABLE> HTML objektumhoz a table-layout stílust kell hozzáadnunk, melynek értéke fixed.
      DataGrid1.Style.Add("table-layout", "fixed");
A táblázat minden sorának magasságát fix értékre be kell állítanunk, mely jelen példánknál 20 pixel lesz.
      DataGrid1.HeaderStyle.Height = 20;
      DataGrid1.ItemStyle.Height = 20;
      DataGrid1.AlternatingItemStyle.Height = 20;
Végül már csak a DataGrid-hez kell kötnünk az adathalmazt.
      DataGrid1.DataSource = dt.DefaultView;
      DataGrid1.DataBind();
      DataGrid2.DataSource = dt.DefaultView;
      DataGrid2.DataBind();
    }