How do you include jQuery UI style files and JavaScript files so that the date and time inputs perfectly display the fields in pt_BR? Do I need to change the attributes of the libraries?
How do you include jQuery UI style files and JavaScript files so that the date and time inputs perfectly display the fields in pt_BR? Do I need to change the attributes of the libraries?
This is the code whose styles can be placed in the header and the javascript libraries along with the codes and attributes can be placed in the footer or in an external file and is suitable for any system that uses html/css/javascript/jquery
to work.
<link href="https://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.min.css" type="text/css" rel="stylesheet" />
<link href="css/jquery.ui.timepicker.css" type="text/css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-1.11.1.js"></script><scriptsrc="https://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<script src="js/jquery.ui.timepicker.js"></script>
<script>
$(function(){
jQuery('#timepicker').timepicker();
jQuery('#datepicker').datepicker();
/* Brazilian initialisation for the jQuery UI date picker plugin. */
/* Written by Leonildo Costa Silva ([email protected]). */
(function( factory ) {
if ( typeof define === "function" && define.amd ) {
// AMD. Register as an anonymous module.
define([ "../datepicker" ], factory );
} else {
// Browser globals
factory( jQuery.datepicker );
}
}(function( datepicker ) {
datepicker.regional['pt-BR'] = {
closeText: 'Fechar',
prevText: '<Anterior',
nextText: 'Próximo>',
currentText: 'Hoje',
monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho',
'Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun',
'Jul','Ago','Set','Out','Nov','Dez'],
dayNames: ['Domingo','Segunda-feira','Terça-feira','Quarta-feira','Quinta-feira','Sexta-feira','Sábado'],
dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'],
dayNamesMin: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb'],
weekHeader: 'Sm',
dateFormat: 'dd/mm/yy',
firstDay: 0,
isRTL: false,
showMonthAfterYear: false,
yearSuffix: ''};
datepicker.setDefaults(datepicker.regional['pt-BR']);
return datepicker.regional['pt-BR'];
}));
/* Brazilian Portuguese translation for the jQuery Timepicker Addon */
/* Written by Diogo Damiani ([email protected]) */
(function ($) {
$.timepicker.regional['pt-BR'] = {
timeOnlyTitle: 'Escolha o horário',
timeText: 'Horário',
hourText: 'Hora',
minuteText: 'Minutos',
secondText: 'Segundos',
millisecText: 'Milissegundos',
microsecText: 'Microssegundos',
timezoneText: 'Fuso horário',
currentText: 'Agora',
closeText: 'Fechar',
timeFormat: 'HH:mm',
amNames: ['a.m.', 'AM', 'A'],
pmNames: ['p.m.', 'PM', 'P'],
isRTL: false
};
$.timepicker.setDefaults($.timepicker.regional['pt-BR']);
})(jQuery);
});
</script>