Value Pickers
The Menu control can be used as a simple value picker. It extends the ComboBox control, which allows you to bind variables to the control's selectedValue property as you would with a ComboBox.
This example ises the selectedIndexChanged event to update the Menu's header and show the current value:
Tax: 8.5%
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | // This file locates: "Scripts/Lesson/C1Input/MenusValuePickers.js".c1.documentReady(function () { var valuePicker = wijmo.Control.getControl('#valuePicker'); // update header to show current selection valuePicker.selectedIndexChanged.addHandler(function (s, e) { if (s.selectedIndex > -1) { s.header = wijmo.format('Tax: <b>{header}</b>', s.selectedItem); } }); // populate menu after hooking up the selectedIndexChanged event valuePicker.itemsSource = [ { header: 'Exempt', value: 0 }, { header: '1%', value: 0.01 }, { header: '5%', value: 0.05 }, { header: '8.5%', value: 0.085 }, { header: '10%', value: 0.10 }, { header: '20%', value: 0.20 } ]; // initialize value valuePicker.selectedValue = .085;}); |
1 2 3 4 5 6 7 8 9 10 11 12 13 | using System.Web.Mvc;namespace LearnMvcClient.Controllers{ public partial class C1InputController : Controller { // GET: MenusValuePickers public ActionResult MenusValuePickers() { return View(); } }} |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <h1> @Html.Raw(Resources.C1Input.MenusValuePickers_Title)</h1><p> @Html.Raw(Resources.C1Input.MenusValuePickers_Text1)</p><p> @Html.Raw(Resources.C1Input.MenusValuePickers_Text2)</p>@(Html.C1().Menu().Id("valuePicker") .DisplayMemberPath("header") .SelectedValuePath("value")) |
