Per prima cosa installi il pacchetto nuget DataPicker.
Nella view inserisci:
<div class="form-group">
<div class='input-group date' id='datepicker1'>
@Html.TextBoxFor(m => m.dataRiferimento, new { @class = "form-control ", @required = "required", @type = "text" }) <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
Al posto della riga Razor puoi utilizzare un tag input.
Nel tag script o nel file esterno dentro al document ready scrivi la parte in jquery:
// data di riferimento datepicker
$('#datepicker1').datepicker({
format: "dd/mm/yyyy",
weekStart: 1,
language: "it",
todayHighlight: true,
orientation: "top left",
autoclose: true
});
$('#datepicker1').datepicker().datepicker("setDate", '+0d');
Nel shared layout o nella view devi importare:
<script src="~/Scripts/bootstrap-datepicker.js"></script>
<script src="~/Scripts/bootstrap-datepicker.min.js"></script>
<script src="~/Scripts/locales/bootstrap-datepicker.it.min.js"></script>
A me cosi facendo funziona tutto.
Spero di esserti stato utile.