Správce souborů pomocí DataGridu v ASP.NET – výpis souborů

1. června 2004

•

Pomocí vykazovacích prvků DataGrid nebo Datalist můžeme snadno dát uživatelům k dispozici webové rozhraní pro soubory na serveru. Ukážeme si základní funkce pro práci se soubory a použijeme DataGrid, který podporuje i snadné stránkování – aplikací pak můžeme rozšířit například bannerový systém, o kterém jsme již psali.

Naše aplikace umožní nejen nahrání souborů na server, ale také procházení souborů a jejich mazání a vyhledávání. Můžeme jej ihned použít jako doplněk pro bannerový systém. Editaci přímo v DataGridu využijeme pro funkci přejmenování souborů. Do aplikace v dalších článcích zařadíme také klientský skript pro zběžný náhled a třídění řádků dle sloupce. Všimněte si, že přidávání nových položek je řešeno v zápatí DataGridu – aby nebyla tyto prázdná pole pro uživatele matoucí při editaci některého záznamu, je při editaci zápatí prostě skryto.

Nejprve si stručně popíšeme princip aplikace. Hlavním prvkem zde bude DataGrid – ten naplníme údaji o souborech zadané složky. Údaje o souborech získáme prostřednictvím I/O funkcí a naplníme jimi DataTable. Pro snadné hledání a filtrování záznamů (textové pole a řada „písmenných“ tlačítek viditelné v ukázce) nad DataTable vytvoříme DataView. DataView nám potom poslouží jako zdroj pro DataGrid.

Potřebná nastavení ve Web.config:

<?xml version=“1.0″ encoding=“utf-8″ ?>
<configuration>
<appSettings>
    <add key=“DataPath“ value=“C:\InetPub\wwwroot\IntervalFileManager\Banners\“ />
    <add key=“MapUrl“ value=“http://server.cz/IntervalFileManaGer/Banners/“ />
    <add key=“FileMask“ value=“*.jp*,*.gif,*.swf,*.png,*.ico,*.bmp,*.pdf,*.txt,*.doc,*.xls“ />
    <add key=“AllowedUploadFileTypes“ value=“jpg,gif,png,bmp,doc,xls,ppt,swf,txt“ />
</appSettings>
</configuration>

DataPath určuje cestu, kam budou uploadovány soubory. MapUrl slouží k určení url, na které budou uploadované soubory ve skutečnosti vidět. FileMask definuje typy souborů, které bude náš manažer zobrazovat. AllowedUploadedFileTypes určuje typy souborů, které je povoleno uploadovat. Zde bych jen doplnil, že v prostředí intranetu často pracujeme s webovou farmou, takže je vhodné cestu pro upload zadávat jako síťovou ve tvaru UNC například \\Machine1\Banners. Samozřejmě po nastavení patřičných přístupových práv pro ASP.NET uživatele, pod kterým naše webová aplikace běží.

Do stránky je třeba importovat některé prostory názvů, jejichž třídy budeme používat:

<%@ Page Language=“C#“ Trace=“False“ EnableSessionState=“False“ Debug=“False“ %>
<%@ Import Namespace=“System.Data“ %>
<%@ Import Namespace=“System.IO“ %>
<%@ Import Namespace=“System.Drawing“ %>

Základem je webový formulář:

<form enctype=“multipart/form-data“ RunAt=“server“>
<asp:TextBox id=“txbSearch“ Width=“8em“ MaxLength=“9″ Size=“9″ AutoPostBack=“False“ RunAt=“server“ />
<asp:Button TabIndex=“1″ CommandName=“phrase“ OnCommand=“SearchDataGrid“ CausesValidation=“False“ Text=“Název“ RunAt=“server“ />
<asp:Button TabIndex=“2″ CommandName=“all“ OnCommand=“SearchDataGrid“ CausesValidation=“False“ Text=“Vše“ RunAt=“server“ />
<asp:Repeater id=“rptCharNavigation“ RunAt=“server“>
    <ItemTemplate>
      <asp:Button Enabled='<%# (String) Container.DataItem != (String) ViewState[„CharArgument“] %>‘ Text='<%# ((String) Container.DataItem).ToUpper() %>‘ CommandArgument='<%# (String) Container.DataItem %>‘ CausesValidation=“False“ OnCommand=“SearchDataGrid“ CommandName=“char“RunAt=“server“ />
    </ItemTemplate>
</asp:Repeater>
Řádků:
<asp:DropDownList id=“ddlPageSize“ OnSelectedIndexChanged=“SetPageSize“ AutoPostBack=“True“ RunAt=“server“>
    <asp:ListItem Value=“10″ Text=“10″ Selected=“True“ />
    <asp:ListItem Value=“30″ Text=“30″ />
    <asp:ListItem Value=“50″ Text=“50″ />
    <asp:ListItem Value=“100″ Text=“100″ />
</asp:DropDownList>
<br />
<asp:Label Id=“lblError“ Visible=“false“ Font-Bold=“true“ RunAt=“server“ />
<br />
<asp:datagrid …
.
</asp:datagrid>
<asp:ValidationSummary ShowMessageBox=“True“ ShowSummary=“False“ RunAt=“server“ />
</form>

Ve formuláři máme TextBox pro vyhledávání, tlačítka pro vyhledání (zapnutí filtru) a zrušení filtru. Součástí formuláře je i Repeater, který bude zobrazovat tlačítka s počátečními písmeny obsažených záznamů, a DropDownList, kterým si uživatel může zvolit počet záznamů zobrazených na stránce. Pro zobrazení různých hlášení máme připraven Label, chybné zadání uživatele zobrazíme prostřednictvím prvku ValidationSummary. Vykázání dat provádíme pomocí DataGridu, kterému nastavíme následující šablonu:

<asp:datagrid id=“Datagrid1″ DataKeyField=“FileName“ CellPadding=“2″ AutoGenerateColumns=“false“ ShowHeader=“true“ ShowFooter=“true“ GridLines=“Horizontal“ OnItemDataBound=“DataGridItemDataBound“ OnEditCommand=“DataGridEdit“ OnCancelCommand=“DataGridCancel“ OnUpdateCommand=“DataGridUpdate“OnItemCommand=“DataGridCommand“ OnPageIndexChanged=“DataGridPage“ AllowPaging=“true“ RunAt=“server“>
<PagerStyle Mode=“NumericPages“ PageButtonCount=“40″ />
<Columns>
    <asp:TemplateColumn>
      <HeaderTemplate>Název souboru</HeaderTemplate>
      <ItemTemplate><a href=“<%# mapUrl + DataBinder.Eval(Container.DataItem, „FileName“) %>“ target=“_preview“><%# DataBinder.Eval(Container.DataItem, „FileName“) %></a><%# ImageSize((String) DataBinder.Eval(Container.DataItem, „FileName“)) %></ItemTemplate>
      <EditItemTemplate>
        <asp:TextBox Id=“txtFileName2″ Text='<%# DataBinder.Eval(Container.DataItem, „FileName“) %>‘ Width=“172px“ ToolTip=“Název“ MaxLength=“50″ RunAt=“server“ />
        <asp:RequiredFieldValidator Display=“None“ ControlToValidate=“txtFileName2″ ErrorMessage=“chybí název“ RunAt=“server“ />
        <asp:RegularExpressionValidator Display=“None“ ControlToValidate=“txtFileName2″ ValidationExpression='<%# ValidFileExpression %>‘ ErrorMessage=“typ souboru není správný“ RunAt=“server“ />
      </EditItemTemplate>
      <FooterTemplate>
        <input style=“width:290px;“ type=“file“ id=“myFile“ RunAt=“server“ >
        <asp:RequiredFieldValidator Display=“None“ Enabled='<%# Datagrid1.ShowFooter %>‘ ControlToValidate=“myFile“ ErrorMessage=“soubor není zadán“ RunAt=“server“ />
        <asp:RegularExpressionValidator Enabled='<%# Datagrid1.ShowFooter %>‘ ValidationExpression='<%# ValidFileExpression %>‘ Display=“None“ RunAt=“server“ ControlToValidate=“myFile“ ErrorMessage=“typ souboru není povolen“ />
      </FooterTemplate>
    </asp:TemplateColumn>
    <asp:TemplateColumn>
      <HeaderTemplate>Datum vytvoření</HeaderTemplate>
      <ItemTemplate><%# DataBinder.Eval(Container.DataItem, „Created“) %></ItemTemplate>
    </asp:TemplateColumn>
    <asp:TemplateColumn ItemStyle-HorizontalAlign=“Right“>
      <HeaderTemplate>Velikost</HeaderTemplate>
      <ItemTemplate><%# DataBinder.Eval(Container.DataItem, „FileSize“) %></ItemTemplate>
    </asp:TemplateColumn>
    <asp:EditCommandColumn ButtonType=“LinkButton“ EditText='<img src=“Images/Edit.gif“ style=“width:20px;height:20px;border:0px“ alt=“Editovat“/>‘ UpdateText='<img src=“Images/Save.gif“ style=“width:20px;height:20px;border:0px“ alt=“Uložit“ />‘ CancelText='<img src=“Images/Cancel.gif“style=“width:20px;height:20px;border:0px“ alt=“Storno“ />‘>
      <HeaderStyle Wrap=“False“ Width=“46px“ />
    </asp:EditCommandColumn>
    <asp:TemplateColumn>
      <HeaderStyle Wrap=“False“ Width=“25px“ />
      <ItemTemplate><asp:LinkButton Text='<img src=“Images/Delete.gif“ style=“width:20px;height:20px;border:0px“ alt=“Smazat“ onclick=“javascript: return confirm('Opravdu smazat?');“ />‘ CommandName=“Delete“ alt=“Přidat nový záznam“ CausesValidation=“false“ RunAt=“server“/></ItemTemplate>
      <FooterTemplate><asp:LinkButton Text='<img src=“Images/Save.gif“ style=“width:20px;height:20px;border:0px“ alt=“Vložit nový záznam“ />‘ CommandName=“Insert“ RunAt=“server“ /></FooterTemplate>
    </asp:TemplateColumn>
</Columns>
</asp:datagrid>

Všimněte si také nastavení vlastnosti (atributu) DataKeyField, díky ní pak můžeme velmi snadno editovat nebo mazat záznamy v datovém zdroji – bez určení této vlastnosti bychom velmi obtížně určovali záznam v datovém zdroji, který odpovídá tomu, jenž je zobrazen v řádku, na který uživatel kliknul.

V obslužném skriptu si připravíme několik statických vlastností z konfiguračních hodnot souboru Web.config, při prvním načtení stránky provedeme naplnění DataGridu:

// adresář, kde jsou soubory
static String xmlDirectory = ConfigurationSettings.AppSettings[„DataPath“];
// cesta pro vytvoření URL k souborům
static String mapUrl = ConfigurationSettings.AppSettings[„MapUrl“];
// maska definující typy zobrazených souborů
static String fileMask = ConfigurationSettings.AppSettings[„FileMask“];
// regulární výraz pro validaci uploadovaných souborů
public static String ValidFileExpression
{
get
{
// stringbuilder se začátkem regulárního výrazu
    StringBuilder myExpression = new StringBuilder (@“^.+\.“);
// načíst povolené typy oddělené čárkami a rozdělit je do pole
    String delimStr = „,;:/“;
    char [] delimiter = delimStr.ToCharArray();
    String[] fileGroups = ConfigurationSettings.AppSettings[„AllowedUploadFileTypes“].Split(delimiter);
    StringBuilder regFileExt = new StringBuilder(String.Empty);
    Int32 fileGroupsIndex = 0;
// v cyklu projít pole jednotlivých typů souborů
    if (fileGroups.Length > 0)
    {
      while (fileGroupsIndex<fileGroups.Length)
      {
        if (fileGroups[fileGroupsIndex].Length > 0)
// pokud položka pole není prázdná, přidat ji do StringBuilderu vznikajícího reg. výrazu
        {
          regFileExt.Append(fileGroups[fileGroupsIndex]);
          if (fileGroupsIndex<fileGroups.Length-1)
          regFileExt.Append(„|“);
        }
        fileGroupsIndex++;
      }
    }
    if (regFileExt.Length > 0)
// pokud se podařilo z Web.config něco vydolovat, přidat to výsledného regulárního výrazu
      myExpression.Append(„(„+regFileExt+“)“);
// jinak nastavit povolenou příponu na „noname“
    else
      myExpression.Append(„(noname)“);
// přidat zakončení konec regulárního výrazu
    myExpression.Append(„{1}$“);
// převést StringBuilder na řetězec a hotovo
    return myExpression.ToString();
}
}
void Page_Load(object sender, System.EventArgs e)
{
if (!IsPostBack)
    BindDataGrid();
}

Za pozornost stojí statická hodnota ValidFileExpression, kterou budeme používat pro určení regulárního výrazu pro validaci, který je zde vytvořen z hodnoty AllowedUploadFileTypes zadané v již popsaném souboru Web.config. Naplnění DataGridu zajistíme metodou BindDataGrid():

void BindDataGrid()
{
Datagrid1.PageSize = Int32.Parse(ddlPageSize.SelectedValue);
DataTable dt = new DataTable();
DataRow dr;
dt.Columns.Add(new DataColumn(„FileName“, typeof(String)));
dt.Columns.Add(new DataColumn(„Created“, typeof(String)));
dt.Columns.Add(new DataColumn(„FileSize“, typeof(String)));
try
{
    String delimStr = „,;:/“;
    char [] delimiter = delimStr.ToCharArray();
    String[] fileGroups = fileMask.Split(delimiter);
    if (fileGroups.Length > 0)
    {
      DirectoryInfo dirInfo = new DirectoryInfo(xmlDirectory);
      FileInfo[] fiInfo;
      foreach(String myMask in fileGroups)
      {
        fiInfo = dirInfo.GetFiles(myMask.Trim());
        foreach(FileInfo fi in fiInfo)
        {
          dr = dt.NewRow();
          dr[0] = fi.Name;
          dr[1] = fi.LastWriteTime.ToString();
          dr[2] = fi.Length.ToString();
          dt.Rows.Add(dr);
        }
      }
      DataView dv = dt.DefaultView;
      dv.Sort = „FileName“;
      ArrayList myButtons = new ArrayList();
      String newButton = String.Empty;
      foreach(DataRowView drC in dv)
      {
        newButton = ((String)drC[0]).Substring(0,1).ToUpper();
        if (myButtons.Count > 0)
        {
          if (newButton != (String) myButtons[myButtons.Count-1])
            myButtons.Add(newButton);
        }
        else
          myButtons.Add(newButton);
      }
      rptCharNavigation.DataSource = myButtons;
      rptCharNavigation.DataBind();
      String CharArgument = (String) ViewState[„CharArgument“];
      if (txbSearch.Text.Length > 0)
        dv.RowFilter=“FileName LIKE ‚%“ + txbSearch.Text + „%'“;
      else if (CharArgument != null && CharArgument.Length > 0)
        dv.RowFilter=“FileName LIKE ‚“ + CharArgument + „%'“;
      Datagrid1.DataSource = dv;
      Datagrid1.DataBind();
      dv.Dispose();
    }
    lblError.Visible = false;
}
catch (Exception eX)
{
    lblError.Text = „Došlo k chybě při čtení dat…<br />“ + eX.Message;
    lblError.Visible = true;
}
finally
{
    dt.Dispose();
}
}

Datagrid zde plníme z DataSetu obdobně jako v článku Stránkování v ovládacím prvku DataGrid – nastavíme velikost stránky, vytvoříme DataTable, řádku DataRow a nadefinujeme potřebné sloupce DataColumn. Dále zjistíme, které všechny přípony chceme na disku hledat – dle masky zadané v souboru Web.config. V cyklu potom tyto přidáváme do DataTable. Jelikož chceme zobrazovat seznam souborů setříděný, obdobně jako v článku Třídění v ovládacím prvku DataGrid, vytvoříme DataView a nastavíme sloupec, podle kterého se má třídit.

Ještě před nabindováním dat do DataGridu s vyrobíme pole ArrayList, které nám poslouží jako zdroj pro vytvoření tlačítek k vyhledávání podle počátečního písmene. Poté ještě v závislosti na hodnotě vyhledávacího pole nebo některého stisknutého vyhledávacího tlačítka nastavíme vyhledávací výraz na naši DataView, výsledek nabindujeme do DataGridu a DataView můžeme zahodit. To celé je uzavřeno do sekvence try-catch, čímž jsou ošetřeny možné chyby vzniklé kdekoli při získávání zdrojových dat.