1

Tengo un formulario y estoy usando DatePicker con Bootstrap para seleccionar fechas. No sé por qué razón el calendario no aparece en español. Éste es mi código, el calendario me aparece en ingles, pero yo lo quiero en español:

<head>
  <link rel="stylesheet" href="<?php echo base_url(); ?>css/datepicker.css" media="screen" />
  <script src="<?php echo base_url(); ?>js/bootstrap-datepicker.js"></script>   
  <script src="<?php echo base_url(); ?>js/locales/bootstrap-datepicker.es.js"></script>   
</head>
<script type="text/javascript">
  $(document).ready(function() {

    $('.calendario').datepicker({
      pickTime: false,
      autoclose: true,
      language: 'es'
    });
  });
</script>
<div class="form-group">                
  <div class="col-xs-3">
    <div class='input-group date'>
      <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
      </span> 
      <input type='text' name="fechainicio" id="fechainicio" class="form-control calendario" value="<?php echo Fechautil::format(date("Y-m-d")); ?>" placeholder="Fecha de Inicio" data-date-format="dd/mm/yyyy" required=""/>
    </div>
  </div> 
</div>
1
  • Hola mer si la respuesta de Alvaro te funciono, por favor, marcala como respuesta aceptada, asi ayudas a otras personas a encontrar soluciones mas rapidamente y generas reputación en la comunidad
    – jasilva
    el 30 jun. 2016 a las 22:54

1 respuesta 1

1

Con tu mismo código, sólo cambiando las rutas de los archivos a versiones online en GitHub o CDN, el calendario se ve en español:

<head>
  <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" />
  <link rel="stylesheet" href="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker3.css"/>
  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>   
  <script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/locales/bootstrap-datepicker.es.js"></script>   
</head>
<script type="text/javascript">
  $(document).ready(function() {

    $('.calendario').datepicker({
      pickTime: false,
      autoclose: true,
      language: 'es'
    });
  });
</script>
<div class="form-group">                
  <div class="col-xs-3">
    <div class='input-group date'>
      <span class="input-group-addon">
        <span class="glyphicon glyphicon-calendar"></span>
      </span> 
      <input type='text' name="fechainicio" id="fechainicio" class="form-control calendario" value="22/02/2016" placeholder="Fecha de Inicio" data-date-format="dd/mm/yyyy" required="" style="width:150px;"/>
    </div>
  </div> 
</div>

Teniendo eso en cuenta, lo más probable es que no estés incluyendo correctamente el fichero del idioma. Asegúrate de que la ruta es la correcta (mira en la consola a ver si hay algún error 404 al cargar el fichero).

4
  • Como dato adicional, en PHP escribes el valor de la fecha con formato "yyyy-mm-dd" (<?php echo Fechautil::format(date("Y-m-d")); ?>), pero a Bootstrap le indicas que va a ir en formato "dd/mm/yyyy" y eso hace que haya otro fallo (por ejemplo, puse la fecha "2016-02-22" y cuando abría el calendario desplegable me salía que era agosto de 1927 en lugar de febero de 2016).
    – Alvaro Montoro
    el 23 feb. 2016 a las 3:03
  • Hola Alvaro, gracias por responderme, en donde m tendria q fijar con el tema de idioma sin cambiar las rutas de los archivos a versiones online, y con respecto al tema del formato de la fecha ya lo cambie, gracias
    – mer
    el 24 feb. 2016 a las 0:24
  • Mira el código generado de la página y comprueba que el fichero bootstrap-datepicker.es.js se carga correctamente (copia la URL en el navegador o revisa la consola para ver si hay errores)
    – Alvaro Montoro
    el 24 feb. 2016 a las 0:33
  • Muchas gracias Alvaro, ya solucione el problema. Si serias tan amable de ayudarme en esto: es.stackoverflow.com/questions/4610/…
    – mer
    el 24 feb. 2016 a las 1:56

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.