Datepicker Asp.Net

3

I'm developing an application and would like to put the date field when it's clicked it displays a calendar for selection in this style: datapicker , but I do not know how to do it.

    
asked by anonymous 22.06.2015 / 19:38

2 answers

1

I'll put it in steps.

jQuery UI

Make sure jQuery UI is installed in your solution. Open the Package Manager Console ( View > Other Windows & kb> Package Manager Console ) and type:

PM> Install-Package jQuery.UI.Combined

Make sure there is a Bundle for it ( App_Start/BundleConfig.cs ):

bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                    "~/Scripts/jquery-ui-{version}.js"));

Make sure this Bundle is in View that will have datepicker or if it is in Views/Shared/_Layout.cshtml :

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")

Initializing

In View , add a script via @section to initialize datepicker :

@section scripts {
    <script>
        $(document).ready(function () {
            $(".datepicker").datepicker({
                autoclose: true,
                format: "dd/mm/yyyy",
                language: "pt-BR"
            });
        });
    </script>
}

This causes everything marked with the datepicker class to receive the visual behavior of a datepicker .

This part will be rendered in the layout where the following is checked:

@RenderSection("scripts", required: false)

Entering Datepickers

The best component to insert is TextBoxFor . It is possible to use EditorFor , but I do not recommend because some strange behaviors may arise:

@Html.TextBoxFor(model => model.Data, new { @class = "form-control datepicker", placeholder = "Minha Data" })

Doing this script, datepicker should work.

    
22.06.2015 / 20:25
1

You can use HTML5, it's very simple

<input type="date">

PS: Not compatible with IE

    
22.06.2015 / 23:35