CollectionView Currency
The CollectionView has a currentItem property that identifies the item that is currently active.
This property is used by controls that support binding to lists and selection (including FlexGrid, FlexChart, ListBox, ComboBox, etc).
The example below implements a simple master/detail screen. Select a country from the ComboBox to change the current item. This raises the currentChanged event which is used to update the elements that show details of the current item.
Country |
|
Downloads | 17,587 |
Sales | $796.26 |
Expenses | $3,890.39 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | // This file locates: "Scripts/Lesson/C1Mvc/CVCurrency.js". c1.documentReady(function () { // create some random data var countries = 'US,Germany,UK,Japan,Italy,Greece,Spain,Portugal,Australia' .split( ',' ); var data = []; for (var i = 0; i < countries.length; i++) { data.push({ id: i, country: countries[i], downloads: Math.round(Math.random() * 20000), sales: Math.random() * 10000, expenses: Math.random() * 5000 }); } // create a CollectionView var view = new wijmo.collections.CollectionView(data, { currentChanged: updateDetails, sortDescriptions: [ 'country' ] }); // country combo var cmbCountry = wijmo.Control.getControl( '#cmbCountry' ); cmbCountry.itemsSource = view; cmbCountry.displayMemberPath = 'country' ; // update details updateDetails(); function updateDetails() { updateDetail( 'downloads' , 'n0' ); updateDetail( 'sales' , 'c' ); updateDetail( 'expenses' , 'c' ); } function updateDetail(prop, fmt) { var text = '' ; if (view.currentItem) { text = wijmo.Globalize.format(view.currentItem[prop], fmt); } document.getElementById(prop).textContent = text; } }); |
1 2 3 4 | // This file locates: "Content/css/Lesson/C1Mvc/CVCurrency.css". .demo-control td { border: none !important; } |
1 2 3 4 5 6 7 8 9 10 11 12 13 | using System.Web.Mvc; namespace LearnMvcClient.Controllers { public partial class C1MvcController : Controller { // GET: CVCurrency public ActionResult CVCurrency() { return View(); } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | < h1 > @Html .Raw(Resources.C1Mvc.CVCurrency_Title) </ h1 > < p > @Html .Raw(Resources.C1Mvc.CVCurrency_Text1) </ p > < p > @Html .Raw(Resources.C1Mvc.CVCurrency_Text2) </ p > < p > @Html .Raw(Resources.C1Mvc.CVCurrency_Text3) </ p > < table class = "table table-condensed" > < tr > < td > @Html .Raw(Resources.C1Mvc.CVCurrency_Text4)</ td > < td > @Html .C1().ComboBox().Id( "cmbCountry" ) </ td > </ tr > < tr > < td > @Html .Raw(Resources.C1Mvc.CVCurrency_Text5)</ td > < td id = "downloads" ></ td > </ tr > < tr > < td > @Html .Raw(Resources.C1Mvc.CVCurrency_Text6)</ td > < td id = "sales" ></ td > </ tr > < tr > < td > @Html .Raw(Resources.C1Mvc.CVCurrency_Text7)</ td > < td id = "expenses" ></ td > </ tr > </ table > |