getting null value in textboxfor tool for date in mvc - asp.net-mvc

Question

I am adding bootstrap date in textboxfor tool and its showing also.
But, the problem is that I am getting null value in controller.
Here is my code
View
#using (Html.BeginForm("Create", "StaffRegistration", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.AntiForgeryToken()
#Html.TextBoxFor(model => model.JoinDate, new { #class = "form-control", placeholder = "DD/MM/YYYY", Name = "date" })
}
Script File
$(document).ready(function () {
var date_input = $('input[name="date"]'); //our date input has the name "date"
var container = $('.bootstrap-iso form').length > 0 ? $('.bootstrap-iso form').parent() : "body";
date_input.datepicker({
format: 'dd/mm/yyyy',
container: container,
todayHighlight: true,
autoclose: true,
})
})
Controller
public ActionResult Create(StaffRegistrationViewModel staffRegistrationViewModel)
{
//here is my code
}
Now, when I click the button at that time at controller side null value is coming.[I saw by doing in debug mode]
In staffRegistrationViewModel, JoinDate field showing null value.
Thank You.

Answer 1

Generally Bootstrap DateTime Picker will Implement like this...
and in this way even you will get the value of selected datetime in post action method(in controller)...
// View Code
<div id="datefrom" class="input-group date">
#Html.TextBoxFor(model => model.FromDate, new { #class = "form-control", #readonly = "readonly", style = "position: static;" })
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
// Jquery Code
$('#datefrom').datetimepicker({
format: 'DD/MM/YYYY HH:mm:ss',
ignoreReadonly: true,
useCurrent: false});