MultiRow - Data Map - C1 ASP.NET MVC

DataMapController.cs
DataMap.cshtml

using System;
using System.Collections;
using System.Globalization;
using System.Linq;
using System.Web.Mvc;
using C1.Web.Mvc;
using MultiRowExplorer.Models;
using System.Collections.Generic;
using C1.Web.Mvc.Serialization;
 
 
namespace MultiRowExplorer.Controllers
{
    public partial class MultiRowController : Controller
    {
        public static List<Sale> SALES = CustomerSale.GetData(100).ToList();
        public ActionResult DataMap()
        {
            ViewBag.Products = CustomerSale.PRODUCTS;
            ViewBag.Colors = CustomerSale.COLORS;
            return View(SALES);
        }
 
        public ActionResult RemoteBindCustomerSale_Read([C1JsonRequest] CollectionViewRequest<Sale> requestData)
        {
            return this.C1Json(CollectionViewHelper.Read(requestData, SALES, (col) =>
            {
                var cell = col as C1.Web.Mvc.MultiRow.CellInfo;
 
                if (cell.Binding == "Product")
                {
                    return CustomerSale.PRODUCTS;
                }
 
                if (cell.Binding == "Color")
                {
                    return CustomerSale.COLORS;
                }
 
                return null;
            }));
        }
 
        public ActionResult ProductsUpdate([C1JsonRequest]CollectionViewEditRequest<Sale> requestData)
        {
            return this.C1Json(CollectionViewHelper.Edit<Sale>(requestData, sale =>
            {
                string error = string.Empty;
                bool success = true;
                var fSale = SALES.Find(item => item.ID == sale.ID);
                fSale.Active = sale.Active;
                fSale.Amount = sale.Amount;
                fSale.Color = sale.Color;
                fSale.Country = sale.Country;
                fSale.Discount = sale.Discount;
                fSale.End = sale.End;
                fSale.Amount2 = sale.Amount2;
                fSale.Start = sale.Start;
                fSale.Product = sale.Product;
                return new CollectionViewItemResult<Sale>
                {
                    Error = error,
                    Success = success && ModelState.IsValid,
                    Data = fSale
                };
            }, () => SALES));
        }
 
    }
}

@using C1.Web.Mvc.Grid
 
@model IEnumerable<Sale>
@{
    List<CustomerSale.NamedProduct> products = ViewBag.Products;
    List<NamedColor> colors = ViewBag.Colors;
    ViewBag.DemoDescription = false;
}
<h3>
    Data Map
</h3>
<p>
    Data maps provide a grid with automatic look up capabilities. For example, you may want to display a customer's name instead of his/her ID, or a color name instead of its RGB value.<br />
    Columns with an associated data map can be sorted by the mapped display value instead of the binding value.<br />
    Columns with an associated data map show drop-down buttons that can be used for quick editing. If you do not want to show the drop-down buttons, set the column's <b>ShowDropDown</b> property to false.
</p>
@(Html.C1().MultiRow<Sale>()
    .Id("dmMultiRow")
    .Bind(bl => bl.Bind(Url.Action("RemoteBindCustomerSale_Read")).Update(Url.Action("ProductsUpdate")))
    .CssClass("multirow")
    .IsReadOnly(false)
    .LayoutDefinition(ld =>
    {
        ld.Add().Colspan(1).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("ID").IsReadOnly(true));
            bl.Add(cb => cb.Binding("Active"));
 
        });
        ld.Add().Colspan(1).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("Start").Format("MMM d yy"));
            bl.Add(cb => cb.Binding("End").Format("HH:mm"));
        });
        ld.Add().Colspan(2).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("Country").Colspan(2));
            bl.Add(cb => cb.Binding("Product")
                .DataMap(dm => dm.DisplayMemberPath("Name")
                    .SelectedValuePath("Id")
                    .SortByDisplayValues(true)
                    .Bind(products)));
            bl.Add(cb => cb.Binding("Color")
                .DataMap(dm => dm.DisplayMemberPath("Name")
                    .SelectedValuePath("Value")
                    .SortByDisplayValues(true)
                    .Bind(colors)));
        });
        ld.Add().Colspan(2).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("Amount").Format("c"));
            bl.Add(cb => cb.Binding("Amount2").Format("c"));
            bl.Add(cb => cb.Binding("Discount").Format("p0").Colspan(2));
 
        });
    })
)
<p>&nbsp;</p>
<h4>
    Multi-column Data Map
</h4>
<p>
    The columns of <b>MultiRow</b> control have a <b>DropDownCssClass</b> property that enables styling the drop-downs used to edit values in data-mapped columns.
</p>
<p>
    To see the multi-column editor in action, click one of the drop-down buttons in the "Color" column,
    or select a cell in that column and press F4:
</p>
@(Html.C1().MultiRow<Sale>()
    .Id("dmMultiColumns")
    .Bind(bl => bl.InitialItemsCount(100).Bind(Model).Update(Url.Action("ProductsUpdate")))
    .CssClass("multirow")
    .IsReadOnly(false)
    .LayoutDefinition(ld =>
    {
        ld.Add().Colspan(1).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("ID").IsReadOnly(true));
            bl.Add(cb => cb.Binding("Active"));
 
        });
        ld.Add().Colspan(1).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("Start").Format("MMM d yy"));
            bl.Add(cb => cb.Binding("End").Format("HH:mm"));
        });
        ld.Add().Colspan(2).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("Country").Colspan(2));
            bl.Add(cb => cb.Binding("Product")
                .DataMap(dm => dm.DisplayMemberPath("Name")
                    .SelectedValuePath("Id")
                    .SortByDisplayValues(true)
                    .Bind(products)));
            bl.Add(cb => cb.Binding("Color")
                .DropDownCssClass("multi-column")
                .DataMap(dm => dm.DisplayMemberPath("Name")
                    .SelectedValuePath("Value")
                    .SortByDisplayValues(true)
                    .Bind(colors)));
        });
        ld.Add().Colspan(2).Cells(bl =>
        {
            bl.Add(cb => cb.Binding("Amount").Format("c"));
            bl.Add(cb => cb.Binding("Amount2").Format("c"));
            bl.Add(cb => cb.Binding("Discount").Format("p0").Colspan(2));
 
        });
    })
)
 
@section Summary{
    This sample demonstrates how to use data map feature, which provides the MultiRow control with automatic look up capabilities.
}

Data Map

Data Map

Features

Data Map

Multi-column Data Map