Bind Directory.EnumerateFiles to a Repeater using

2019-08-01 15:18发布

问题:

I am trying to create a small web app, that when I type in a game name, it will search through a folder with a whole lot of icons to find one similar to the typed in game.

I then want to show a repeater with the name of the icon, as well as the icon next to it.

So far I have successfully displayed the name with this code:

IEnumerable<string> getfiles =
            from f in
                Directory.EnumerateFiles(Server.MapPath("~/_resources/game_icon"), "*.*", SearchOption.AllDirectories)
            where Path.GetFileName(f).ToLower().Contains(txtGameName.Text.ToLower())
            select Path.GetFileNameWithoutExtension(f);

        List<AllFiles> all = getfiles.Select(file => new AllFiles
            {
                FileName = file, 
                SubdirectoryName = "",
                FileNameWithExtension = ""
            }).ToList();

        rptGameMatches.DataSource = all;
        rptGameMatches.DataBind();

But havent had much luck in displaying the icon, which would be in ImageLocation.

Ive tried playing with:

foreach (string file in Directory.EnumerateFiles(Server.MapPath("~/_resources/game_icon"), "*.*", SearchOption.AllDirectories).Count() )
        {
            if(file.)
        }

and

for (int i = 0; i < Directory.EnumerateFiles(Server.MapPath("~/_resources/game_icon"), "*.*", SearchOption.AllDirectories).Count(); i++)
        {

        }

With no success.

I know there is a simplistic way to do this, but I cant quite seem to get it right. Could someone please show me where I'm going wrong?

回答1:

Here's an example of what you could do (for compactness reasons I have placed the code behind and the markup inside a single WebForm but of course you could have the code behind in a separate file):

<%@ Page Language="C#" %>
<%@ Import Namespace="System.IO" %>

<script type="text/c#" runat="server">
    protected void BtnSearchClick(object sender, EventArgs e)
    {
        var images =
            from image in Directory.EnumerateFiles(Server.MapPath(folder), "*.*", SearchOption.AllDirectories)
            let relativeLocation = image.Replace(root, string.Empty).Replace("\\", "/")
            let url = ResolveUrl("~/" + relativeLocation)
            where image.ToLower().Contains(txtGameName.Text.ToLower())
            select new 
            {
                Url = url
            };

        results.DataSource = images;
        results.DataBind();
    }
</script>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtGameName" runat="server" />
        <asp:LinkButton ID="btnSearch" runat="server" OnClick="BtnSearchClick" Text="Search" />
        <asp:Repeater ID="results" runat="server">
            <ItemTemplate>
                <asp:Image runat="server" ImageUrl='<%# Eval("Url") %>' />
            </ItemTemplate>
        </asp:Repeater>
    </div>
    </form>
</body>
</html>

Alright, so we have a web page containing a text field, a button and a repeater. When the button is clicked we are searching for all images in the specified folder whose name contains the text entered into the text field:

var images =
    from image in Directory.EnumerateFiles(Server.MapPath(folder), "*.*", SearchOption.AllDirectories)
    let relativeLocation = image.Replace(root, string.Empty).Replace("\\", "/")
    let url = ResolveUrl("~/" + relativeLocation)
    where image.ToLower().Contains(txtGameName.Text.ToLower())
    select new 
    {
        Url = url
    };

There are a few steps here:

let filename = Path.GetFileName(image)

at this stage we are getting the physical location to the file. It will look like this:

c:\inetpub\wwwroot\_resources\game_icon\image1.png

Then we strip the application root and replace the slashes:

let relativeLocation = filename.Replace(root, string.Empty).Replace("\\", "/")

so relativeLocation becomes:

_resources/game_icon/image1.png

and the last step is:

let url = ResolveUrl("~/" + relativeLocation)

which will turn that into:

/_resources/game_icon/image1.png

So at the end of the day the images collection might look like this (assuming the user searched for image in the text field):

[
    { Url: "/_resources/game_icon/image1.png" },
    { Url: "/_resources/game_icon/subfolder1/image2.png" },
    { Url: "/_resources/game_icon/subfolder2/image1.png" },
    ...
]

It is this collection that is bound to the repeater. Inside the repeater we have defined an Image whose ImageUrl property will be data bound to the Url property of the anonymous object we constructed.