ComponentOne
Web API Explorer ASP.NET Web API Explorer

MVCFlexGrid

Tree View

Features

Settings


Export
Export Name :

Description

This sample demonstrates how to export a mvc flexgrid bound with hierarchical data to excel file.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using WebApiExplorer.Models;

namespace WebApiExplorer.Controllers
{
    public partial class MVCFlexGridController : Controller
    {
        private readonly GridExportImportOptions _flexGridTreeViewModel = new GridExportImportOptions
        {
            NeedExport = true,
            NeedImport = false,
            IncludeColumnHeaders = true
        };

        public ActionResult TreeView()
        {
            ViewBag.Options = _flexGridTreeViewModel;
            var list = Folder.Create(Server.MapPath("~")).Children;
            return View(list);
        }

    }
}
@using WebApiExplorer.Models
@using C1.Web.Mvc.Grid
@model IEnumerable<ITreeItem>
@{
    GridExportImportOptions optionsModel = ViewBag.Options;
    ViewBag.DemoSettings = true;
}

<style>
    .custom-flex-grid {
        height: 400px;
        background-color: white;
        box-shadow: 4px 4px 10px 0px rgba(50, 50, 50, 0.75);
        margin-bottom: 12px;
    }

    .custom-flex-grid .wj-cell {
        background-color: #fff;
        border: none;
        font-size: 10pt;
    }

    .custom-flex-grid .wj-state-selected {
        background: #000;
        color: #fff;
    }

    .custom-flex-grid .wj-state-multi-selected {
        background: #222;
        color: #fff;
    }
</style>

<label>@Html.Raw(Resources.MVCFlexGrid.TreeView_Text1)</label>

@(Html.C1().FlexGrid().Id(optionsModel.ControlId).CssClass("custom-flex-grid").Width(500)
    .Bind(Model)
    .ChildItemsPath("Children")
    .IsReadOnly(true)
    .AutoGenerateColumns(false)
    .Columns(columns =>
    {
        columns.Add().Binding("Header").Width("*");
        columns.Add().Binding("Size").Width("80").Align("center");
    })
    .AllowResizing(AllowResizing.None)
    .HeadersVisibility(HeadersVisibility.None)
    .SelectionMode(SelectionMode.ListBox)
)

@section Settings{
    @Html.Partial("_FlexGridOptions", optionsModel)
}

<script>
    c1.documentReady(function () {
        wijmo.Control.getControl("#@optionsModel.ControlId").rows.defaultSize = 25;
    });
</script>

@section Description {
    @Html.Raw(Resources.MVCFlexGrid.TreeView_Text0)
}