BlazorDatasheet

Blazordatasheet

Komponen lembar data sederhana untuk mengedit data tabel.

Fitur

• Pengeditan data
  • Editor bawaan termasuk teks, tanggal, pilih, boolean, area teks, enum
  • Tambahkan editor khusus untuk jenis data apa pun
• Pemformatan bersyarat
• Validasi data
• Rumus
• Navigasi keyboard
• Salin dan Tempel dari Data Tabulasi
• Virtualisasi - Menangani banyak sel sekaligus di kedua baris & col.

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

Memulai

Instal Paket Nuget

dotnet add package BlazorDatasheet

Konfigurasikan Program.cs

Di Program.cs, tambahkan layanan yang diperlukan:

 builder . Services . AddBlazorDatasheet ( ) ; 

Impor JS/CSS

Di _layout.cshtml atau index.html add

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

Dan

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

Blazor DataSheet menyediakan komponen blazor lembar data yang menerima lembar.

Lembar menyimpan data dan konfigurasi untuk lembar data. Data diatur per sel, atau dapat dibangun menggunakan ObjectEditorBuilder, yang membuat lembar data berdasarkan daftar objek.

Kode berikut menampilkan kisi data 3 x 3 yang kosong.

 < Datasheet
    Sheet = "sheet" / >

@code {

    private Sheet sheet ;

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

}

Editor default adalah editor teks, tetapi dapat diubah dengan mendefinisikan properti tipe masing -masing sel.

Mengatur & Mendapatkan Nilai Sel

Nilai sel dapat diatur dalam beberapa cara:

 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" ) ) ;

Nilai sel disimpan secara internal di dalam pembungkus CellValue . Nilai dikonversi secara implisit ketika diatur di atas dan CellValueType ditetapkan ke sel.

CellValueType digunakan untuk evaluasi rumus dan dapat menjadi salah satu dari yang berikut:

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

Konversi ini dapat dikontrol, misalnya ketika mengatur tipe sel ke "teks", nilai akan selalu disimpan sebagai string dan tidak ada konversi yang akan dilakukan.

Konversi juga dapat dimodifikasi dengan menggunakan acara Sheet.Cells.BeforeCellValueConversion . Dengan mengubah properti NewValue dari argumen, nilai yang disimpan dimodifikasi.

Rumus

Formula dapat diterapkan pada sel. Ketika sel atau berkisar, sel rumus merujuk berubah, nilai sel dihitung ulang.

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

Format

Format sel dapat diatur dengan cara berikut:

 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" } ;

Ketika format sel ditetapkan, itu akan digabungkan ke dalam format sel yang ada di wilayah yang diterapkannya. Paremeter format non-nol akan digabungkan:

 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"

Jenis sel

Jenis sel menentukan renderer dan editor mana yang digunakan untuk sel. Jenis sel juga membantu konversi eksplisit ketika nilai sel diatur.

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

Editor dan renderer khusus dapat ditentukan. Lihat contoh untuk informasi lebih lanjut.

Validasi

Validasi data dapat diatur pada sel/rentang. Ada dua mode validasi: ketat dan tidak ketat. Ketika validator ketat, nilai sel tidak akan ditetapkan oleh editor jika gagal validasi.

Jika validasi tidak ketat, nilainya dapat ditetapkan selama pengeditan tetapi akan menunjukkan kesalahan validasi saat diberikan.

Meskipun validasi yang ketat dapat diatur pada sel, nilainya dapat diubah secara terprogram, tetapi akan ditampilkan sebagai kesalahan validasi.

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

Daerah dan rentang

Sebuah wilayah adalah konstruksi geometris, misalnya:

 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

Kisaran adalah wilayah yang juga tahu tentang lembaran tersebut. Rentang dapat digunakan untuk mengatur bagian -bagian tertentu dari lembar.

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

Tautan komunitas

• Menggunakan lembar data Blazor Excel untuk memperbarui database
• Menggunakan OpenAi untuk memperbarui lembar kerja Blazor Excel
• Kain Microsoft dan Lembar Data Blazor