Learn MVC Client Learn ASP.NET MVC Edition Client

Adding/Removing

Vertical Alignment

Collection View

Loading JSON Dates

Infinite Scrolling

Hierarchical Data

Editable Tree Grids

Unbound Tree Grids

Read-only, Required Columns

Conditional Styling

Dynamic Updates

Multiple Chart Types

Special Chart Types

Candlestick Charts

HighLowOpenClose Charts

Zooming with the Wheel

Grouping and Drill-down

Grouping and Drill-down

Interactive Charts

Filtering and Zooming

Grouping and Drill-down

Basic Properties

Result
Source
Document

InputDate Ranges

Use the InputDate's min and max properties to restrict the range of dates that can be entered.

For example, the InputDate below only accepts dates within the current week:

The Date

// This file locates: "Scripts/Lesson/C1Input/InputDateRanges.js".
c1.documentReady(function () {
    // InputDate with a range restriction
    var theInputDate = wijmo.Control.getControl('#theInputDate');
 
    var curr = new Date(),
        firstDay = new Date(curr.setDate(curr.getDate() - curr.getDay())),
        lastDay = new Date(curr.setDate(curr.getDate() - curr.getDay() + 6));
 
    theInputDate.min = firstDay;
    theInputDate.max = lastDay;
});

using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1InputController : Controller
    {
        // GET: InputDateRanges
        public ActionResult InputDateRanges()
        {
            return View();
        }
    }
}

<h1>
    @Html.Raw(Resources.C1Input.InputDateRanges_Title)
</h1>
 
<p>
    @Html.Raw(Resources.C1Input.InputDateRanges_Text1)
</p>
<p>
    @Html.Raw(Resources.C1Input.InputDateRanges_Text2)
</p>
<div class="demo-settings">
    <label for="theInputDate">@Html.Raw(Resources.C1Input.InputDateRanges_Text3)</label>
    @Html.C1().InputDate().Id("theInputDate").Format("MMM dd, yyyy")
</div>