Foros del Web - Ver Mensaje Individual - datepicker en Jquery, duda con sus eventos

Naahuel · #2 (**permalink**) 17/06/2011, 05:58

Podés probar algo así:

Código HTML:

Ver original<!DOCTYPE html>
<html>
<head>
<link class="jsbin" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
 
  <script>
    $(function() {
      var input_inicio = $('#fecha_inicio');
      var input_fin = $('#fecha_fin');
      
      input_inicio.datepicker({
         onClose: function(dateText, inst) {
           var nuevaFecha = _SumarAnio(dateText, +1);
            input_fin.val(nuevaFecha);
         },
        dateFormat:'dd/mm/yy'
      });
      
      input_fin.datepicker({
         onClose: function(dateText, inst) {
           var nuevaFecha = _SumarAnio(dateText, -1);
           input_inicio.val(nuevaFecha);         
         },
        dateFormat:'dd/mm/yy'
      });
      
      function _SumarAnio(fecha, numAnios){
        var arrFe = fecha.split('/');
        return arrFe[0] + '/' + arrFe[1] + '/' + (parseInt(arrFe[2],10) + numAnios);
      }
      
    });
  </script>
  
  
</head>
<body>
  <p>Fecha inicio <input type="text" id="fecha_inicio" /></p>
  <p>Fecha fin <input type="text" id="fecha_fin" /></p>
</body>
</html>

Si cambiás la fecha de inicio, el fin se pone un año más tarde y viceversa.
Acá lo podés ver en funcionamiento:
http://jsbin.com/itumo5

Tené en cuenta que el script está limitado al formato de fecha 'dd/mm/aaaa'.