Passer au contenu du pied de page
UTILISATION D'IRONXL

Comment afficher Excel dans ASP.NET

Ce tutoriel complet démontrera comment créer un visualiseur Excel en utilisant ASP.NET MVC et IronXL. Ce visualiseur permettra aux utilisateurs d'afficher, éditer et naviguer dans des fichiers Excel directement depuis leur page web.

Qu'est-ce qu'IronXL ?

IronXL est une puissante bibliothèque .NET qui offre une pléthore de fonctionnalités liées aux opérations Excel. Il propose une API simplifiée qui permet aux développeurs .NET d'écrire, manipuler et lire des documents Excel dans divers formats de fichiers, y compris XLS, XLSX, CSV, et plus.

With IronXL, you can read Excel files, extract data, add or edit worksheets, create or modify rows and columns, apply formulas, save changes, and so much more. Toutes ces opérations peuvent être effectuées sans qu'Excel de Microsoft soit installé sur votre machine.

IronXL prend en charge les images, le style, le formatage conditionnel, et d'autres fonctionnalités Excel complexes, ce qui en fait une solution complète pour les opérations Excel .NET. C'est parfait pour gérer les besoins en sources de données et tableurs pour vos applications ASP.NET MVC. La bibliothèque IronXL sera utilisée pour visualiser les fichiers Excel dans les applications Web ASP.NET.

Prérequis

  • Compréhension de base d'ASP.NET MVC
  • Visual Studio installé sur votre machine
  • La bibliothèque IronXL installée. Vous pouvez trouver le guide d'installation dans leur documentation officielle.

Commencer

Tout d'abord, créons un nouveau projet ASP.NET MVC dans Visual Studio.

  1. Ouvrez Visual Studio.
  2. Cliquez sur Fichier > Nouveau > Projet.
  3. Dans la fenêtre du nouveau projet, choisissez le modèle Application Web ASP.NET (.NET Framework).

    Comment visualiser Excel dans ASP.NET, Figure 1 : Créez une nouvelle application Web ASP.NET dans Visual Studio Créez une nouvelle application Web ASP.NET dans Visual Studio

  4. Nommez votre projet ExcelViewer, sélectionnez l'emplacement du projet et cliquez sur le bouton Créer.

    Comment visualiser Excel dans ASP.NET, Figure 2 : Configurez votre projet Configurez votre projet

Cet article se concentrera sur la mise en œuvre de la fonctionnalité de visualisation Excel dans cette application ASP.NET MVC.

Ajouter IronXL à votre projet

Pour gérer les formats de fichiers Excel (comme .xls, .xlsx et .csv), IronXL offre des fonctionnalités complètes pour charger des documents Excel, lire, écrire et même modifier des données Excel. Il prend en charge les formules, les images, le formatage et bien plus encore.

  1. Cliquez avec le bouton droit sur votre projet dans Explorateur de solutions et accédez à Gérer les packages NuGet.
  2. Dans le Gestionnaire de packages NuGet, recherchez IronXL.Excel.
  3. Cliquez sur Installer pour l'ajouter à votre projet.

    Comment visualiser Excel dans ASP.NET, Figure 3 : Rechercher et installer le package IronXL dans l'interface utilisateur du gestionnaire de packages NuGet Recherche et installation du package IronXL dans l'interface utilisateur du gestionnaire de packages NuGet

Vous pouvez également installer IronXL en utilisant la console du gestionnaire de packages avec la commande suivante :

Install-Package IronXL.Excel

Comment visualiser Excel dans ASP.NET, Figure 4 : Installer le package IronXL depuis la console du gestionnaire de packages Installer le package IronXL depuis la console du gestionnaire de packages

Maintenant qu'IronXL est installé, passons à l'étape suivante.

Construire des modèles

ExcelModel

La première étape consiste à créer un modèle pour les données Excel. La classe ExcelModel représentera une seule feuille Excel et contiendra le nom de la feuille et les données présentes dans la feuille Excel.

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelModel
    {
        public string SheetName { get; set; }

        // Data is a list of string arrays, each array represents a row in the sheet.
        public List<string[]> Data { get; set; }
    }
}
namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelModel
    {
        public string SheetName { get; set; }

        // Data is a list of string arrays, each array represents a row in the sheet.
        public List<string[]> Data { get; set; }
    }
}
Namespace Excel_File_Viewer_IronXL.Models
	Public Class ExcelModel
		Public Property SheetName() As String

		' Data is a list of string arrays, each array represents a row in the sheet.
		Public Property Data() As List(Of String())
	End Class
End Namespace
$vbLabelText   $csharpLabel

Le ExcelModel est défini avec deux propriétés, SheetName et Data. SheetName est une simple chaîne de caractères pour contenir le nom de chaque feuille Excel. Data est une liste de tableaux de chaînes de caractères pour stocker les données de chaque ligne dans la feuille Excel.

ExcelViewModel

Ensuite, créons ExcelViewModel. Ce modèle est un conteneur qui comprend un fichier, un message et une liste de ExcelModel représentant les données de toutes les feuilles du fichier.

using Microsoft.AspNetCore.Http;
using System.Collections.Generic;

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelViewModel
    {
        public IFormFile File { get; set; }  // For uploading Excel file
        public string Message { get; set; }  // Message for storing success/error messages
        public List<ExcelModel> ExcelData { get; set; }  // List to store data from all sheets
    }
}
using Microsoft.AspNetCore.Http;
using System.Collections.Generic;

namespace Excel_File_Viewer_IronXL.Models
{
    public class ExcelViewModel
    {
        public IFormFile File { get; set; }  // For uploading Excel file
        public string Message { get; set; }  // Message for storing success/error messages
        public List<ExcelModel> ExcelData { get; set; }  // List to store data from all sheets
    }
}
Imports Microsoft.AspNetCore.Http
Imports System.Collections.Generic

Namespace Excel_File_Viewer_IronXL.Models
	Public Class ExcelViewModel
		Public Property File() As IFormFile ' -  For uploading Excel file
		Public Property Message() As String ' -  Message for storing success/error messages
		Public Property ExcelData() As List(Of ExcelModel) ' -  List to store data from all sheets
	End Class
End Namespace
$vbLabelText   $csharpLabel

Cette classe sera utilisée comme modèle de vue. Elle possède une propriété IFormFile pour l'upload de fichiers, une chaîne Message pour afficher des messages, et une List<ExcelModel> pour stocker les données Excel récupérées.

5. Créer ExcelController pour charger les fichiers Excel pour l'extraction de données

Puis créez un nouveau ExcelController. C'est là que la magie opère ! Les fichiers Excel sont chargés en utilisant la fonction WorkBook.Load d'IronXL, boucler à travers les feuilles de calcul, extraire les données et les ajouter au ExcelViewModel.

using Excel_File_Viewer_IronXL.Models;
using IronXL;
using System.Collections.Generic;
using System.Web.Mvc;
using System;
using System.Linq;

public class ExcelController : Controller
{
    // GET: Excel
    public ActionResult Index()
    {
        var model = new ExcelViewModel();

        // Define the file path for the Excel file
        string filePath = Server.MapPath("~/App_Data/Test.xlsx"); 

        // List to store data for each sheet
        List<ExcelModel> data = new List<ExcelModel>();

        try
        {
            // Load workbook directly from a file path
            var workbook = WorkBook.Load(filePath);

            // Loop through all worksheets in the workbook
            foreach (var worksheet in workbook.WorkSheets)
            {
                // Add each worksheet's name and data to the data list
                data.Add(new ExcelModel
                {
                    SheetName = worksheet.Name,
                    Data = worksheet.Rows.Select(r => r.ToArray().Select(c => c.Value.ToString()).ToArray()).ToList()
                });
            }

            model.ExcelData = data;
            model.Message = "File processed successfully!";
        }
        catch (Exception ex)
        {
            model.Message = $"Error occurred while processing file: {ex.Message}";
        }

        return View(model);
    }
}
using Excel_File_Viewer_IronXL.Models;
using IronXL;
using System.Collections.Generic;
using System.Web.Mvc;
using System;
using System.Linq;

public class ExcelController : Controller
{
    // GET: Excel
    public ActionResult Index()
    {
        var model = new ExcelViewModel();

        // Define the file path for the Excel file
        string filePath = Server.MapPath("~/App_Data/Test.xlsx"); 

        // List to store data for each sheet
        List<ExcelModel> data = new List<ExcelModel>();

        try
        {
            // Load workbook directly from a file path
            var workbook = WorkBook.Load(filePath);

            // Loop through all worksheets in the workbook
            foreach (var worksheet in workbook.WorkSheets)
            {
                // Add each worksheet's name and data to the data list
                data.Add(new ExcelModel
                {
                    SheetName = worksheet.Name,
                    Data = worksheet.Rows.Select(r => r.ToArray().Select(c => c.Value.ToString()).ToArray()).ToList()
                });
            }

            model.ExcelData = data;
            model.Message = "File processed successfully!";
        }
        catch (Exception ex)
        {
            model.Message = $"Error occurred while processing file: {ex.Message}";
        }

        return View(model);
    }
}
Imports Excel_File_Viewer_IronXL.Models
Imports IronXL
Imports System.Collections.Generic
Imports System.Web.Mvc
Imports System
Imports System.Linq

Public Class ExcelController
	Inherits Controller

	' GET: Excel
	Public Function Index() As ActionResult
		Dim model = New ExcelViewModel()

		' Define the file path for the Excel file
		Dim filePath As String = Server.MapPath("~/App_Data/Test.xlsx")

		' List to store data for each sheet
		Dim data As New List(Of ExcelModel)()

		Try
			' Load workbook directly from a file path
			Dim workbook = WorkBook.Load(filePath)

			' Loop through all worksheets in the workbook
			For Each worksheet In workbook.WorkSheets
				' Add each worksheet's name and data to the data list
				data.Add(New ExcelModel With {
					.SheetName = worksheet.Name,
					.Data = worksheet.Rows.Select(Function(r) r.ToArray().Select(Function(c) c.Value.ToString()).ToArray()).ToList()
				})
			Next worksheet

			model.ExcelData = data
			model.Message = "File processed successfully!"
		Catch ex As Exception
			model.Message = $"Error occurred while processing file: {ex.Message}"
		End Try

		Return View(model)
	End Function
End Class
$vbLabelText   $csharpLabel

Here, initialize an ExcelViewModel and then load the WorkBook using IronXL, loop through each WorkSheet, and for each WorkSheet, we create an ExcelModel with the name and data of the worksheet. Le ExcelModel est ensuite ajouté à la liste ExcelData dans le ExcelViewModel.

Les données du fichier Excel suivant vont être chargées et affichées :

Comment visualiser Excel dans ASP.NET, Figure 5 : Le fichier Excel d'exemple Le fichier Excel d'exemple

6. Créer la vue

Dans votre répertoire Views/Excel, créez un nouveau fichier HTML Index.cshtml pour afficher les données Excel. Ensuite, utilisez les nav-tabs de Bootstrap pour représenter chaque feuille du fichier Excel. Chaque feuille sera un onglet séparé, et le contenu de l'onglet sera les données de la feuille.

@model Excel_File_Viewer_IronXL.Models.ExcelViewModel

@{
    ViewBag.Title = "Index";
}

<h2>Excel File Viewer</h2>

@if (Model.ExcelData != null)
{
    <ul class="nav nav-tabs" id="myTab" role="tablist">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <li class="nav-item">
                <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected="@(i == 0)">
                    @Model.ExcelData[i].SheetName
                </a>
            </li>
        }
    </ul>
    <div class="tab-content" id="myTabContent">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i">
                <table class="table table-bordered">
                    @foreach (var row in Model.ExcelData[i].Data)
                    {
                        <tr>
                            @foreach (var cell in row)
                            {
                                <td>@cell</td>
                            }
                        </tr>
                    }
                </table>
            </div>
        }
    </div>
}
@model Excel_File_Viewer_IronXL.Models.ExcelViewModel

@{
    ViewBag.Title = "Index";
}

<h2>Excel File Viewer</h2>

@if (Model.ExcelData != null)
{
    <ul class="nav nav-tabs" id="myTab" role="tablist">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <li class="nav-item">
                <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected="@(i == 0)">
                    @Model.ExcelData[i].SheetName
                </a>
            </li>
        }
    </ul>
    <div class="tab-content" id="myTabContent">
        @for (int i = 0; i < Model.ExcelData.Count; i++)
        {
            <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i">
                <table class="table table-bordered">
                    @foreach (var row in Model.ExcelData[i].Data)
                    {
                        <tr>
                            @foreach (var cell in row)
                            {
                                <td>@cell</td>
                            }
                        </tr>
                    }
                </table>
            </div>
        }
    </div>
}
model ReadOnly Property () As Excel_File_Viewer_IronXL.Models.ExcelViewModel
	ViewBag.Title = "Index"
End Property

'INSTANT VB TODO TASK: The following line could not be converted:
(Of h2) Excel File Viewer</h2> [if](Model.ExcelData != Nothing)
If True Then
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <ul class="nav nav-tabs" id="myTab" role="tablist"> for(int i = 0; i < Model.ExcelData.Count; i++)
	"myTab" role="tablist"> [for](Integer i = 0; i < Model.ExcelData.Count; i)
		If True Then
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <ul class="nav nav-tabs" id="myTab" role
	"nav nav-tabs" id="myTab" role
	<ul class="nav nav-tabs" id
	i += 1
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected="@(i == 0)"> @Model.ExcelData[i].SheetName </a> </li>
			"content-@i" aria-selected="@(i == 0)"> Model.ExcelData(i).SheetName </a> </li>
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls="content-@i" aria-selected
			"tab" aria-controls="content-@i" aria-selected
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role="tab" aria-controls
			"#content-@i" role="tab" aria-controls
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href="#content-@i" role
			"tab" href="#content-@i" role
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle="tab" href
			"tab-@i" data-toggle="tab" href
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle
			"nav-link @(i == 0 ? "active" : "")" id="tab-@i" data-toggle
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <li class="nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id
			"nav-item"> <a class="nav-link @(i == 0 ? "active" : "")" id
			<li class="nav-item"> <a class
		End If
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: </ul> <div class="tab-content" id="myTabContent"> for(int i = 0; i < Model.ExcelData.Count; i++)
	"tab-content" id="myTabContent"> [for](Integer i = 0; i < Model.ExcelData.Count; i)
		If True Then
	</ul> <div class="tab-content" id
	i += 1
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i"> <table class="table table-bordered"> foreach(var row in Model.ExcelData[i].Data)
			"tab-@i"> <table class="table table-bordered"> foreach(var row in Model.ExcelData(i).Data)
					If True Then
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby="tab-@i"> <table class
			"tabpanel" aria-labelledby="tab-@i"> <table class
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role="tabpanel" aria-labelledby
			"content-@i" role="tabpanel" aria-labelledby
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <div class="tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role
			"tab-pane fade @(i == 0 ? "show active" : "")" id="content-@i" role
			<div class="tab-pane fade @(i == 0 ? "show active" : "")" id
'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'						(Of tr) @foreach(var cell in row)
'							{
'								<td> @cell</td>
'							}
						</tr>
					End If
				</table> </div>
		End If
	</div>
End If
$vbLabelText   $csharpLabel

Dans cet exemple de code, nav nav-tabs générera une liste d'onglets, chacun représentant une feuille du fichier Excel. Le contenu correspondant de l'onglet affichera les données de la feuille respective sous forme de tableau. En apportant quelques modifications, un bouton de navigation est ajouté pour sélectionner le fichier Excel manuellement.

Exécution du programme

Après avoir suivi toutes les étapes et configuré correctement le projet, il est temps de l'exécuter. Vous devriez voir une page web avec des onglets nommés d'après les noms de feuilles de votre fichier Excel. Cliquer sur un onglet affichera les données de la feuille respective sous forme de tableau.

Comment visualiser Excel dans ASP.NET, Figure 6 : Le visualiseur Excel Le visualiseur Excel

Conclusion

Vous venez de créer un visualiseur Excel ASP.NET en utilisant IronXL ! Cette puissante bibliothèque permet aux utilisateurs de travailler avec des fichiers Excel de manière plus efficace et gérable. Avec l'aide d'IronXL, manipuler des fichiers Excel n'a jamais été aussi simple dans l'environnement .NET.

IronXL provides a essai gratuit, vous permettant d'explorer et de comprendre ses fonctionnalités vastes sans aucun coût initial. Une fois que vous l'avez testé et trouvé qu'il s'agit de la solution parfaite pour vos besoins, la licence commence à partir de $799.

Questions Fréquemment Posées

Comment puis-je créer une visionneuse Excel en utilisant ASP.NET MVC ?

Vous pouvez créer une visionneuse Excel en utilisant ASP.NET MVC en configurant un nouveau projet dans Visual Studio et en ajoutant la bibliothèque IronXL via le gestionnaire de packages NuGet. Cela vous permet de charger, afficher et manipuler les fichiers Excel directement dans votre application web.

Quelles sont les étapes pour configurer un projet ASP.NET MVC pour gérer des fichiers Excel ?

Pour configurer un projet ASP.NET MVC pour gérer des fichiers Excel, ouvrez Visual Studio, créez un nouveau projet d'application web ASP.NET, et installez la bibliothèque IronXL via NuGet. Ensuite, implémentez des modèles comme ExcelModel et ExcelViewModel pour gérer les données Excel, et utilisez le ExcelController pour charger et traiter les fichiers Excel.

Puis-je afficher plusieurs feuilles Excel dans une application ASP.NET ?

Oui, vous pouvez afficher plusieurs feuilles Excel dans une application ASP.NET en utilisant IronXL pour charger le fichier Excel puis utilisez les nav-tabs de Bootstrap pour créer des onglets séparés pour chaque feuille, affichant les données dans un format de tableau.

Comment puis-je charger et traiter un fichier Excel dans ASP.NET en utilisant une bibliothèque .NET ?

Dans ASP.NET, vous pouvez charger et traiter un fichier Excel en utilisant la méthode WorkBook.Load d'IronXL. Cette méthode vous permet de lire le fichier Excel, de parcourir ses feuilles de calcul, et d'extraire les données pour les afficher ou les manipuler ultérieurement.

Quels sont les avantages d'utiliser IronXL pour les opérations Excel dans .NET ?

IronXL offre plusieurs avantages pour les opérations Excel dans .NET, y compris la prise en charge de divers formats de fichiers Excel, la capacité de manipuler des fonctionnalités Excel complexes comme les images et le formatage conditionnel, et l'absence de nécessité d'installation de Microsoft Excel sur le serveur.

Comment puis-je résoudre les problèmes courants lors de la création d'une visionneuse Excel ASP.NET ?

Les problèmes courants lors de la création d'une visionneuse Excel ASP.NET peuvent être résolus en s'assurant que la bibliothèque IronXL est correctement installée via NuGet, en vérifiant que tous les modèles et contrôleurs nécessaires sont bien implémentés, et en s'assurant que les fichiers Excel sont dans un format pris en charge.

Est-il possible de modifier les fichiers Excel directement depuis une page web ASP.NET ?

Oui, il est possible de modifier les fichiers Excel directement depuis une page web ASP.NET en utilisant IronXL. La bibliothèque vous permet de charger des fichiers Excel dans votre application web, de modifier les données, et d'enregistrer les modifications dans le fichier sans interruption.

IronXL supporte-t-il la lecture et l'écriture de fichiers Excel ?

Oui, IronXL supporte à la fois la lecture et l'écriture de fichiers Excel. Vous pouvez l'utiliser pour lire les données à partir de documents Excel existants et écrire de nouvelles données ou des modifications dans des fichiers Excel dans plusieurs formats, incluant XLS, XLSX, et CSV.

Quels modèles doivent être créés pour gérer les données Excel dans une application ASP.NET MVC ?

Dans une application ASP.NET MVC, vous devez créer des modèles tels que ExcelModel pour représenter les feuilles Excel individuelles, et ExcelViewModel pour gérer une collection de feuilles et gérer le téléchargement de fichiers et la messagerie.

Comment puis-je tester les fonctionnalités d'IronXL avant de l'acheter ?

Vous pouvez tester les fonctionnalités d'IronXL en téléchargeant la version d'essai gratuite disponible sur leur site web. Cette version d'essai vous permet d'explorer les capacités de la bibliothèque dans la gestion des fichiers Excel au sein de vos applications .NET sans coût initial.

Jordi Bardia
Ingénieur logiciel
Jordi est le plus compétent en Python, C# et C++, et lorsqu'il ne met pas à profit ses compétences chez Iron Software, il programme des jeux. Partageant les responsabilités des tests de produit, du développement de produit et de la recherche, Jordi apporte une immense valeur à l'amé...
Lire la suite