<h1>
    InputDate
</h1>

<p>
    The InputDate control allows users to enter and edit dates.
    It has the following advantages over regular input elements:
</p>
<ol>
    <li>
        Users cannot enter non-numeric values at all.
    </li>
    <li>
        You can use the <b>format</b> property to format the number
        as it is edited, making it easy to read.
    </li>
    <li>
        You can use the <b>min</b> and <b>max</b> properties to
        specify the valid range of values (users will not be
        able to enter values outside this range).
    </li>
    <li>
        You can use the <b>step</b> property to specify an
        increment that is added to the value when the user
        clicks the increment/decrement buttons on the control.
    </li>
</ol>

<p>
    For example, here is an InputDate with default
    settings:
</p>
<div class="demo-settings">
    <label for="theDate">InputDate</label>
    @Html.C1().InputDate().Id("theDate")
</div>
<div>
    The current date is <b><span id="theDateOutput"></span></b>.
</div>

<p></p>
<p>
    By default, InputDate values are required, so you can't
    delete the entire content of the control. If you want to
    enter dates that are optional, set the <b>isRequired</b>
    property to false:
</p>
<div class="demo-settings">
    <label for="theDateNotRequired">Not Required</label>
    @Html.C1().InputDate().Id("theDateNotRequired").Placeholder("Your birth date (optional)")
</div>