bootstrap datepicker in asp.net - asp.net

Question

I am new to coding and trying out bootstrap datepicker in my small project.
I have used bootstrap datepicker in my code. It works fine for selecting a date and populating it on the box but I do not understand how to access this date in codebehind.
here is my code:
<div class="form-group">
<asp:Label ID="lblDOB" runat="server" CssClass="col-xs-12" class="form-control" Text="Date Of Birth" Font-Bold="true"></asp:Label>
<div class="row">
<!-- Include Bootstrap Datepicker -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" />
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script>
<div class="form-group">
<div class="col-xs-12 date">
<div class="input-group input-append date" id="datePicker">
<input type="text" class="form-control" name="date" />
<span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
</div>
<script>
$(document).ready(function() {
$('#datePicker')
.datepicker({
format: 'mm/dd/yyyy'
})
.on('changeDate', function(e) {
// Revalidate the date field
$('#eventForm').formValidation('revalidateField', 'date');
});
$('#eventForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
name: {
validators: {
notEmpty: {
message: 'The name is required'
}
}
},
date: {
validators: {
notEmpty: {
message: 'The date is required'
},
date: {
format: 'MM/DD/YYYY',
message: 'The date is not a valid'
}
}
}
}
});
});
</script>
</div>
</div>
<div class="form-group">
<asp:Label ID="lblEmail" runat="server" CssClass="col-xs-12" AssociatedControlID="txtEmail" class="form-control" Text="Email"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server" CssClass="form-control" placeholder="Enter Email"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblPhoneNumber" runat="server" CssClass="col-xs-12" AssociatedControlID="txtPhoneNumber" class="form-control" Text="Phone Number"></asp:Label>
<asp:TextBox ID="txtPhoneNumber" runat="server" CssClass="form-control" placeholder="Enter Primary Phone Number"></asp:TextBox>
</div>
<div class="form-group">
<asp:Label ID="lblSecondaryNumber" runat="server" CssClass="col-xs-12" AssociatedControlID="txtSecondaryNumber" class="form-control" Text="Secondary Phone Number"></asp:Label>
<asp:TextBox ID="txtSecondaryNumber" runat="server" CssClass="form-control" placeholder="Enter Secondary Phone Number"></asp:TextBox>
</div>
<div>
<asp:Button ID="btnSubmit" runat="server" CssClass="btn btn-primary btn-lg" Text="submit" />
</div>
CodeBehind:
Protected Sub btnSubmit_click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnSubmit.Click
InitiateAdd()
End Sub
Private Sub InitiateAdd()
Try
Dim conn As New Connection(Connection.EConnectionString.Library)
Using conn.Connection
Actions.AddInformationUser(datepicker.text,txtEmail.Text, txtPhoneNumber.Text, txtSecondaryNumber.Text, conn.Connection)
End Using
Catch ex As Exception
Library.Helper.ShowMessage(ex.Message)
End Try
End Sub
If I want to use the Email in my codebehind then I would use txtEmail.text, but I do not understand how to get the value in datepicker in my codebehind.I tied it with datePicker.text as datePicker was the id given to the div but it did not work.

Answer 1

The datepicker appears to be getting it's values stored in:
<input type="text" class="form-control" name="date" />
Try adding a runat="server" attribute in there and and Id, use that Id in your code to pick it up.