Datepicker formatting correctly

ok so i have a datepicker and the initial state is like this Jul. 21, 2010 but when i pick a date i get this format 07/21/2010 how do i get it so when i select the date from the datepicker it goes back to this format Jul. 21, 2010

here is my code

开发者_Go百科<p class="left search_date"><%= text_field_tag "tee_date", @date.strftime('%b. %d, %Y'), :size => 9 if @date %><span class="search_tip">(Change)</span></p>                                                          

    <script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
  $("#tee_date").datepicker();
    var tee_date = $("#tee_date").datepicker({ maxDate: '+1y', minDate: new Date() });
    $(".search_tip").click(function(){
        tee_date.datepicker("show");
    });
  });
</script>

Just add the parameter dateFormat: 'M d,yy' when you call the datepicker function ..

var tee_date = $("#tee_date").datepicker({ maxDate: '+1y', minDate: new Date(), dateFormat: 'M d,yy' });