Features

Introduction

Introduction

The FlexSheet control extends the FlexGrid control and provides an Excel-like functionality.

Features

Introduction

The FlexSheet control extends the FlexGrid control and provides an Excel-like functionality.
FlexSheet supports all the FlexGrid's features, and focuses on the key features from Excel not included in FlexGrid.

Note:FlexSheet requires the JSZip library for loading and saving xlsx file, you should add jszip.js via CDN or include the script file in the project.

FlexSheet provides following Excel-like features:

Multiple Sheets
Include multiple separated sheets in a single worksheet.
Formulas
Calculation engine includes built-in formula support, complete with nearly 100 formulas and auto-completion. Our formula operations were built to align with Microsoft Excel, including operations for aggregation, mathematics, logic and text.
Cell Style
Cell-styling support includes format, font, horizontal alignment, fore color, fill color and more.
Merge Cells
User can merge any cells, in contrast with FlexGrid, which only supports content-driven cell merging.
Undo/Redo
Undo/redo mutiple operations include edit cell, insert/remove rows/columns, apply cell style, merge cells, resize rows/columns, drag and drop rows/columns and more.
Drag & Drop
Drag and drop rows/columns for moving and copying.
Select whole column
Select the whole column by clicking the column header.
Allow Auto Fill
Auto fill cells with data that follows a pattern by dragging the bottom right corner of the cell.

using Microsoft.AspNetCore.Mvc;

namespace FlexSheetExplorer.Controllers
{
 public partial class FlexSheetController : Controller
 {
 public ActionResult Intro()
 {
 return View();
 }
 }
}

<div>
 <div class="copy">
 <h3>
 @Html.Raw(FlexSheetRes.Intro_Text4)
 </h3>
 <p>@Html.Raw(FlexSheetRes.Intro_Text0)</p>

 <div class="collapsed-content collapse">
 <p>@Html.Raw(FlexSheetRes.Intro_Text1)</p>

 <dl class="dl-horizontal">
 <dt>@Html.Raw(FlexSheetRes.Intro_Text5)</dt>
 <dd>@Html.Raw(FlexSheetRes.Intro_Text6)</dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text7)</dt>
 <dd>
 @Html.Raw(FlexSheetRes.Intro_Text8)
 </dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text9)</dt>
 <dd>@Html.Raw(FlexSheetRes.Intro_Text10)</dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text11)</dt>
 <dd>@Html.Raw(FlexSheetRes.Intro_Text12)</dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text13)</dt>
 <dd>
 @Html.Raw(FlexSheetRes.Intro_Text14)
 </dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text15)</dt>
 <dd>@Html.Raw(FlexSheetRes.Intro_Text16)</dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text17)</dt>
 <dd>@Html.Raw(FlexSheetRes.Intro_Text18)</dd>
 <dt>@Html.Raw(FlexSheetRes.Intro_Text20)</dt>
 <dd>@Html.Raw(FlexSheetRes.Intro_Text21)</dd>
 </dl>
 </div>
 <p>
 <button type="button"
 data-toggle="collapse"
 data-target=".collapsed-content, .btn.btn-default.btn-xs.collapse"
 class="btn btn-default btn-xs collapse in">
 @Html.Raw(FlexSheetRes.Intro_Text2)
 </button>
 </p>
 </div>
 <div>
 <c1-flex-sheet class="flexSheet" allow-auto-fill="true">
 <c1-unbound-sheet column-count="12" row-count="25"></c1-unbound-sheet>
 <c1-unbound-sheet column-count="12" row-count="25"></c1-unbound-sheet>
 </c1-flex-sheet>
 </div>
</div>
@section Summary{
 <p>@Html.Raw(FlexSheetRes.Intro_Text3)</p>

}