Ciao,
provo a postare un nuovo codice che si addice maggiormente al framework chge sto utilizzando ovvero bootstrap. Tutti gli altri script funzionano correttamente, ma in questo caso non risco a far eseguire il calcolo della differenza tra le due date espressa in giorni.

Ecco il codice:

codice HTML:
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>  
      <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
      <link href="http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
      <link rel="stylesheet" type="text/css" media="all" href="daterangepicker-bs3.css" />
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
      <script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
      <script type="text/javascript" src="moment.js"></script>
      <script type="text/javascript" src="daterangepicker.js"></script>
</head>

            <h4>Basic Single Date Picker</h4>
            <div class="well">
data inizio
                 <fieldset>
                  <div class="control-group">
                    <div class="controls">
                     <div class="input-prepend input-group">
                       <span class="add-on input-group-addon"><i class="glyphicon glyphicon-calendar fa fa-calendar"></i></span><input type="text" style="width: 200px" name="dinizio" id="dinizio" class="form-control" /> 
                     </div>
                    </div>
                  </div>
                 </fieldset>

               <script type="text/javascript">
               $(document).ready(function() {
                  $('#dinizio').daterangepicker({ singleDatePicker: true }, function(start, end, label) {
                    console.log(start.toISOString(), end.toISOString(), label);
                  });
               });
               </script>

            </div>

            <div class="well">
data fine
                 <fieldset>
                  <div class="control-group">
                    <div class="controls">
                     <div class="input-prepend input-group">
                       <span class="add-on input-group-addon"><i class="glyphicon glyphicon-calendar fa fa-calendar"></i></span><input type="text" style="width: 200px" name="dfine" id="dfine" class="form-control" /> 
                     </div>
                    </div>
                  </div>
                 </fieldset>

               <script type="text/javascript">
               $(document).ready(function() {
                  $('#dfine').daterangepicker({ singleDatePicker: true }, function(start, end, label) {
                    console.log(start.toISOString(), end.toISOString(), label);
                  });
               });
               </script>

            </div>

            <div class="well">
numero giorni
                 <fieldset>
                  <div class="control-group">
                    <div class="controls">
                     <div class="input-prepend input-group">
                       <span class="add-on input-group-addon"><i class="glyphicon glyphicon-calendar fa fa-calendar"></i></span><input type="text" style="width: 200px" name="days" id="days" class="form-control" /> 
                     </div>
                    </div>
                  </div>
                 </fieldset>
                        <script>
                        $(document).ready(function() {

                        $( "#dinizio,#dfine" ).datepicker({
                        changeMonth: true,
                        changeYear: true,
                        firstDay: 1,
                        dateFormat: 'DD/MM/YY',
                        })

                        $( "#dinizio" ).datepicker({ dateFormat: 'DD/MM/YY' });
                        $( "#dfine" ).datepicker({ dateFormat: 'DD/MM/YY' });

                        $('#dfine').change(function() {
                        var inizio = $('#dinizio').datepicker('getDate');
                        var fine   = $('#dfine').datepicker('getDate');

                        if (inizio<fine) {
                        var days   = (fine - inizio)/1000/60/60/24;
                        $('#days').val(days);
                        }
                        else {
                        alert ("You cant come back before you have been!");
                        $('#dinizio').val("");
                        $('#dfine').val("");
                        $('#days').val("");
                        }
                        }); //end change function
                        }); //end ready
                        </script>

            </div>
Il calendario opola correttamente i campi data inizio e data fine, ma non esegue il calcolo della differenza in giorni tra le due date scelte.

Dove sbaglio secondo voi?


Grazie