InputColor
InputColor
Overview
Features
Sample
Description
This sample shows the basic usage of the InputColor control.
Source
IndexController.cs
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace MvcExplorer.Controllers { public partial class InputColorController : Controller { public ActionResult Index() { return View(); } } }
Index.cshtml
@using System.Drawing <p> <img id="image1" src="@Href("~/Content/images/room.png")" /> </p> @section Scripts{ <style> .invalid-tooltip { background-color: red; color: yellow; opacity: 0.9; border-color: lightcoral; } </style> <script> var _invalidTooltip; c1.documentReady(function () { _invalidTooltip = new wijmo.Tooltip(); _invalidTooltip.cssClass = 'invalid-tooltip'; _invalidTooltip.position = 11; window.addEventListener('resize', function () { if (_invalidTooltip.isVisible) { _invalidTooltip.hide(); onInvalidInput(); } }); }) function onInvalidInput(input, e) { e && (e.cancel = true); _invalidTooltip.show("#invalidInput", "@Html.Raw(Resources.InputColor.Index_Text2)"); } function onValueChanged(input, e) { _invalidTooltip && _invalidTooltip.hide(); changeColor(input, e); } function changeColor(sender, e) { document.getElementById("image1").style.backgroundColor = sender.value; } </script> } <div> <label>@Html.Raw(Resources.InputColor.Index_Text0)</label> @(Html.C1().InputColor() .Id("invalidInput") .Value(Color.White) .ClickAction(ClickAction.Toggle) .OnClientInvalidInput("onInvalidInput") .OnClientValueChanged("onValueChanged") ) </div> @section Description{ @Html.Raw(Resources.InputColor.Index_Text1) }
Documentation