Show just a single picture within a container

I am working on displaying an image that I want to loop through from a folder.

<div class="blah">
<% System.IO.FileInfo[] files = new System.IO.DirectoryInfo(Server.MapPath("/MyPath/"))
.GetFiles();
var exefiles = from System.IO.FileInfo f in files
               where f.Extension == ".jpg" ||f.Extension == ".jpeg" 
               || f.Extension == "JPG" 
               select f;
int count = 0;
foreach (System.IO.FileInfo f in exefiles) { %>
   <img src="blahblah.jpg" />
   <% if(++count >= 1) break; %>
<% } %>
</div>

Issue: The div currently displays all images stored in the folder.

However, my goal is to have only one image displayed in the div.

Thank you for your help!

Answer №1

You can achieve this using the Directory.GetFiles Method (String, String) (System.IO)

Here's an example:

<div class="custom">
<% 
    string directoryPath = "images/";
    string[] imageFiles = System.IO.Directory.GetFiles(Server.MapPath(directoryPath), "*jp*g");
    if (imageFiles.Length > 0) { %>
    <img src="<%= directoryPath + System.IO.Path.GetFileName(imageFiles[0])%>" />
<%  } %>
</div>

Answer №2

Avoid incorporating login elements directly into your view; this concept aligns with the principles of Model-View-Controller architecture. Instead, embed your business logic within the Action and transmit it to the view using either the model or ViewBag.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Trigger a function when clicking outside the element, similar to how a Bootstrap modal is closed

I have successfully created a popup box using angular in my project. It appears when I click on an icon and disappears when I click on the close button. However, I would like it to also close if someone clicks outside of the popup. Can anyone help me with ...

Hide only medium-sized elements with Bootstrap 4

In my latest online project, I decided to integrate Bootstrap 4. The main focus is on mobile users, but I also want to ensure desktop users have a good experience. However, I am facing difficulties in hiding certain texts on medium screens only using pred ...

What is the best way to implement rounded borders using CSS?

Can we use the latest CSS standards to create rounded borders? Unfortunately, this feature is only available in CSS level 3 and above. ...

Creating a dynamic animation for a navigation bar's underline

I'm attempting to add a smooth underline effect to the links in my navbar when they are hovered over. Unfortunately, the entire ul element is being underlined instead of just the selected link. Is there a way to resolve this issue? a { text-deco ...

Changing padding of a button causes surrounding elements to move?

Trying to make a button in CSS appear "pushed down" on :active, I decided to increase the padding-top by 2px and decrease padding-bottom by 2px. However, this adjustment seemed to affect the margins of other elements for some reason that eludes me. I am c ...

Map region indicator tooltip

I possess a map that contains a specific area with a title. Here is the accompanying code: <map name="Map" id="Map"> <area alt="" shape="rect" coords="127,52,186,71" href="#" title="Extending telephone lines to other Egyptian governorates ...

Customizing the style of react-select is essential for creating a unique and visually appealing user experience

I am looking to maintain the visual style of my input fields to match that of a react-select component. I have been advised to use styled-components, yet I am uncertain about which styles need to be adjusted in order to achieve the desired outcome. Ideally ...

Unable to center text within a CSS div rotated 90 degrees due to width limitations caused by rotation; solution involves utilizing flexbox

Currently, I am working on creating a tab positioned on the right side, as illustrated in the image below: https://i.sstatic.net/QGTEB.png The desired width for the tab on the right is only 25px. To achieve this layout, I am utilizing flexbox for the cont ...

How can I ensure that a div is positioned over another div with the same coordinates across all screen sizes?

[http://jsfiddle.net/w7r3gveg/]1 I am looking to position 4 Facebook logos in the center bottom of my background image. The background is represented by the 'bg' div, while the Facebook logo is in the 'facebook' div. Currently, I can ...

What is the process for generating a list of Razor Pages in Blazor?

I'm currently working on creating a list of razor pages. To clarify, in my "Index.razor" file, I have the following: @page "/" @inject IJSRuntime JSRuntime <h1 style="text-align:center;color:red">Hey :)</h1> <br /> <Counter/> ...

Adjusting the width of columns in a table

Previously in Bootstrap 3, I was able to use col-sm-xx on the th tags within the thead to resize table columns as needed. However, this functionality is no longer available in Bootstrap 4. How can I achieve a similar effect in Bootstrap 4? <thead> & ...

Refresh Panel triggers postback after a period of dormancy

Within my SharePoint solution, I have incorporated an asp.net user control that utilizes Telerik Asp.net Ajax controls to facilitate basic datagrid CRUD operations. This grid is utilized within a web part on a SharePoint 2013 page. The datagrid is enclose ...

Placing circular buttons below the navigation bar

I'm currently working on implementing a navigation bar on my master page. Here is the code snippet for the navigation bar: <nav class="navbar" style="background-color: #264653; position:absolute; top:0px; left:50%; transform:tran ...

What strategies can I implement to ensure my modal dialog box remains responsive? Adjusting the window size causes the modal box to malfunction and lose its structure

Whenever I adjust the size of the browser window, the elements inside the modal box become misaligned. HTML <div class='modal'> <div class='modal-content'> </div> </div> Below is the CSS for the modal ...

shutting down a pop-up modal

I am currently trying to add a button within a modal pop up to close it when clicked. The modal pop up is triggered by clicking on a hyperlink. I have attempted the following code: <ajaxToolKit:ModalPopupExtender ID="mPopup" runat="server" TargetContro ...

Transform the standard method into an asynchronous function

I have a generic method in an abstract class that is used in various places throughout the application: protected T Execute<T>(Func<T> func) { try { return func(); } catch (Invali ...

the section disappears once it is moved to the bottom of another section

My project is complete, but I've encountered a problem that needs solving. I want to create a website with a Metro design aesthetic. The three div boxes on the left side should remain fixed, while only the middle part scrolls horizontally. Now, I also ...

The MethodInfo class for reflection in C#

Is there a way to call a method by providing its name as a string in an aspx code-behind file? Here is the approach I've tried: private void invokeMethod(string methodName) { object instance = Activator.CreateInstance(this.GetType(), null); M ...

Implementing a GridViewDropDown column in a Telerik GridView within an ASP.NET application

How can I add a GridDropDownColumn in ASP.NET? I have a Telerik GRIDVIEW and would like to include a DropdownColumn in the GridView. When trying to do so, I encountered an issue with DataSource not being a valid property. Is there a way to add a GridDrop ...

Creating a Jquery Dialog in MVC 4 without redirecting to a new page

I have a page with 5-7 or more links, and I want to display the link's data in a dialog box. However, when clicking on a link, it opens the link in the window and also displays the data in the dialog box. Can you please advise on the correct way to di ...