The date format of bootstrap-dateppicker is not effective on page load

My datepicker textbox is generated in ASP.NET MVC:

@Html.TextBoxFor(model => model.StartDate, new {@class = "form-control datepicker", placeholder = "Pick a date...", data_date_format="mm/dd/yyyy"})

'.datepicker()` is then called:

$().ready(function() {
    $('.datepicker').datepicker();
});

It appears there is the format in place, just not in the beginning.

When the page is first loaded, the textbox shows 4/24/2015 12:00:00 AM. But when a date is picked, the format then applies and shows a date without the time stamp.

Is there any option or setting I've missed?

If you wanted the simplicity of handling this all on the client with the native format you've chosen for the datepicker, you can just trigger the formatting by setting the date to itself on page load:

<!-- language: lang-js -->

// update and date to trigger formatting
$('#myDate').datepicker('update',$('#myDate').datepicker("getDate"))

Alternatively, here's an extension method you can add that will reformat the date in an control when called:

<!-- language: lang-js -->

$.fn.reformatDate = function(settings) {  
  return this.each(function() {  
    $this = $(this);
    if (!$this.data('datepicker')) return 
    $this.datepicker('setDate',$this.datepicker("getDate"))
  });
};

Then use it like this:

<!-- language: lang-js -->

$('#myDate').reformatDate();

Demo in Stack Snippets

<!-- begin snippet: js hide: false --> <!-- language: lang-js -->

$.fn.reformatDate = function(settings) {  
  return this.each(function() {  
    $this = $(this);
    if (!$this.data('datepicker')) return 
    $this.datepicker('setDate',$this.datepicker("getDate"))
  });
};

$(function() {
    // simulate pre-filled date from server
    $("#myDate").val(new Date());
  
    // initialize like normal
    $('#myDate').datepicker();
    
    // update date to trigger formatting
    $('#myDate').reformatDate();
});

<!-- language: lang-html -->

<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.1/css/datepicker.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.1/js/bootstrap-datepicker.js"></script>

<input id="myDate" type="text" class="datepicker"  />

<!-- end snippet -->