BlazorDatasheet

Blazordatasheet

Eine einfache Datenblattkomponente für die Bearbeitung von Tabellendaten.

Merkmale

• Datenbearbeitung
  • Eingebaute Redakteure einschließlich Text, Datum, Auswählen, Boolescher, Textbereich, Enum
  • Fügen Sie benutzerdefinierte Editoren für einen beliebigen Datentyp hinzu
• Bedingte Formatierung
• Datenvalidierung
• Formel
• Tastaturnavigation
• Kopieren und einfügen aus tabellarischen Daten
• Virtualisierung - behandelt viele Zellen gleichzeitig sowohl in Reihen als auch in Cols.

Demo: https://anmcgrath.github.io/blazordatasheet/

Erste Schritte

Installieren Sie das Nuget -Paket

dotnet add package BlazorDatasheet

Program.cs konfigurieren

Fügen Sie in Program.cs die erforderlichen Dienste hinzu:

 builder . Services . AddBlazorDatasheet ( ) ; 

JS/CSS importieren

In _layout.cshtml oder index.html hinzufügen

 <link href="_content/BlazorDatasheet/sheet-styles.css" rel="stylesheet"/>

Und

 <script src="_content/BlazorDatasheet/blazor-datasheet.js" type="text/javascript"></script>

Blazor Datasheet bietet eine Datenblatt -Blazor -Komponente, die ein Blatt akzeptiert.

Ein Blatt enthält die Daten und die Konfiguration für ein Datenblatt. Die Daten werden pro Zelle festgelegt oder können mit dem Objektionskörperbuilder erstellt werden, wodurch ein Datenblatt basierend auf einer Liste von Objekten erstellt wird.

Der folgende Code zeigt ein leeres 3 x 3 -Datenraster an.

 < Datasheet
    Sheet = "sheet" / >

@code {

    private Sheet sheet ;

    protected override void OnInitialized ( )
    {
        sheet = new Sheet ( 3 , 3 ) ;
    }

}

Der Standard -Editor ist der Texteditor, kann jedoch geändert werden, indem die Typ -Eigenschaft jeder Zelle definiert wird.

Einstellen und Erhalten von Zellwerten

Zellwerte können auf einige Arten festgelegt werden:

 sheet . Cells [ 0 , 0 ] . Value = "Test"
sheet . Range ( "A1" ) . Value = "Test" ;
sheet . Cells . SetValue ( 0 , 0 , "Test" ) ;
sheet . Commands . ExecuteCommand ( new SetCellValueCommand ( 0 , 0 , "Test" ) ) ;

Zellwerte werden intern in einer CellValue gespeichert. Die Werte werden implizit konvertiert, wenn sie oben eingestellt sind und der Zelle ein CellValueType zugeordnet ist.

Der CellValueType wird zur Formelbewertung verwendet und kann eine der folgenden sein:

    Empty = 0,
    Error = 1,
    Array = 2,
    Unknown = 3,
    Sequence = 4,
    Reference = 5,
    Number = 6,
    Date = 7,
    Text = 8,
    Logical = 9,

Diese Konvertierung kann gesteuert werden, beispielsweise beim Einstellen des Zelltyps auf "Text" werden Werte immer als Zeichenfolgen gespeichert und keine Umwandlung durchgeführt.

Die Konvertierung kann zusätzlich mithilfe des Ereignisses von Sheet.Cells.BeforeCellValueConversion modifiziert werden. Durch Ändern der NewValue -Eigenschaft des Arguments wird der gespeicherte Wert geändert.

Formel

Die Formel kann auf Zellen angewendet werden. Wenn sich die Zellen oder Bereiche, in denen sich die Formel-Zellen referenzieren, ändert, wird der Zellwert neu kalkuliert.

 sheet . Cells [ 0 , 0 ] . Formula = "=10+A2"

Formatierung

Zellformate können auf folgende Weise festgelegt werden:

 sheet . Range ( "A1:A2" ) . Format = new CellFormat ( ) { BackgroundColor = "red" } ;
sheet . Commands . ExecuteCommand (
    new SetFormatCommand ( new RowRegion ( 10 , 12 ) , new CellFormat ( ) { ForegroundColor = "blue" } ) ) ;
sheet . SetFormat ( sheet . Range ( new ColumnRegion ( 5 ) ) , new CellFormat ( ) { FontWeight = "bold" } ) ;
sheet . Cells [ 0 , 0 ] . Format = new CellFormat ( ) { TextAlign = "center" } ;

Wenn ein Zellformat festgelegt ist, wird es in alle vorhandenen Zellformate in der Region, auf die es angewendet wird, zusammengefasst. Jegliche Nicht-Null-Format-Paremeter werden zusammengeführt:

 sheet . Range ( "A1" ) . Format = new CellFormat ( ) { BackgroundColor = "red" } ;
sheet . Range ( "A1:A2" ) . Format = new CellFormat ( ) { ForegroundColor = "blue" } ;
var format = sheet . Cells [ 0 , 0 ] . Format ; // backroundColor = "red", foreground = "blue"
var format2 = sheet . Cells [ 1 , 0 ] . Format ; // foreground = "blue"

Zelltypen

Der Zelltyp gibt an, welcher Renderer und Editor für die Zelle verwendet werden. Zelltypen helfen auch bei expliziten Konvertierungen, wenn Zellwerte festgelegt werden.

 sheet . Range ( "A1:B5" ) . Type = "boolean" ; // renders a checkbox

Benutzerdefinierte Redakteure und Renderer können definiert werden. Weitere Informationen finden Sie in den Beispielen.

Validierung

Die Datenvalidierung kann auf Zellen/Bereiche eingestellt werden. Es gibt zwei Validierungsmodi: strenge und nicht streng. Wenn ein Validator streng ist, wird der Zellwert nicht vom Editor festgelegt, wenn er die Validierung fehlschlägt.

Wenn die Validierung nicht streng ist, kann der Wert während der Bearbeitung festgelegt werden, zeigt jedoch einen Validierungsfehler, wenn er gerendert wird.

Obwohl eine strikte Validierung in einer Zelle festgelegt werden kann, kann der Wert programmgesteuert geändert werden, wird jedoch als Validierungsfehler angezeigt.

 sheet . Validators . Add ( new ColumnRegion ( 0 ) , new NumberValidator ( isStrict : true ) ) ;

Regionen und Bereiche

Eine Region ist ein geometrisches Konstrukt, zum Beispiel:

 var region = new Region ( 0 , 5 , 0 , 5 ) ; // r0 to r5, c0 to c5
var cellRegion = new Region ( 0 , 0 ) ; // cell A1
var colRegion = new ColumnRegion ( 0 , 4 ) ; // col region spanning A to D
var rowRegion = new RowRegion ( 0 , 3 ) ; // row region spanning 1 to 4

Ein Bereich ist eine Region, die auch über das Blatt weiß. Bereiche können verwendet werden, um bestimmte Teile des Blattes einzustellen.

 var range = sheet . Range ( "A1:C5" ) ;
var range = sheet . Range ( new ColumnRegion ( 0 ) ) ;
var range = sheet . Range ( 0 , 0 , 4 , 5 ) ;

Community -Links

• Verwenden eines Blazor Excel -Datenblattes zum Aktualisieren einer Datenbank
• Verwenden von OpenAI, um ein Blazor Excel -Arbeitsblatt zu aktualisieren
• Microsoft Fabric und das Blazor -Datenblatt