I have a .NET Framework 4.8 App and i have to build a datepicker in javascript using a List which is my model in my cshtml file.
@{
ViewBag.Title = "Index";
}
@model WebParetoMVCNEW.Models.Data.Csv.CsvData
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="container mt-5">
<div class="row">
<form method="post" enctype="multipart/form-data"
action="@Url.Action("UploadFile", "LieferPerformance")">
<div class="mb-3">
<label for="csvFile" class="form-label">CSV Datei auswählen</label>
<input type="file" class="form-control" id="csvFile" name="csvFile">
</div>
<button type="submit" class="btn btn-primary">Hochladen und
Auslesen</button>
</form>
</div>
</div>
<div class="container mt-3">
<div class="row">
<div class="col-md-6">
<input type="text" id="my_date_picker1">
<button id="datepicker-button">Open Datepicker</button>
</div>
</div>
</div>
<script>
$(document).ready(function () {
// Serialize the list from the model as JSON within the script block
var headerListData = @Html.Raw(Json.Serialize(Model.YourListPropertyName));
// Get the current date
var currentDate = new Date();
// Configure the Datepicker using jQuery UI and set the default date to today
$("#my_date_picker1").datepicker({
dateFormat: 'yy-mm-dd',
defaultDate: currentDate, // Set the default date to today
beforeShowDay: function (date) {
var formattedDate = $.datepicker.formatDate('yy-mm-dd', date);
if (headerList && headerList.indexOf(formattedDate) >= 0) {
return [true, "av", 'Available'];
} else {
return [false, "notav", "Not Available"];
}
}
});
$("#datepicker-button").on("click", function () {
$("#my_date_picker1").datepicker("show");
});
});
This seems not to work inside javascript:
var headerListData = @Html.Raw(Json.Serialize(Model.Header));
Errormessage: The name 'Html' does not exist in the current context
Like described in Accessing MVC's model property from Javascript it doesnt work
anyone an idea?
You can Serialize model object in javascript and then use it like JSON Object to retrieve desired property.
var _model = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(@Model));
var headerListData = _model.YourListPropertyName;