Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

230
Vistas
¿Hay alguna manera de deshabilitar el botón mes/modo de vista en bootstrap-datetimepicker?

Actualicé bootstrap de la versión 3 a la 4 y noté que el calendario se superpone al crearlo con js en lugar de cshtml. No es necesario retroceder más de unos pocos días, por lo que me gustaría desactivar el botón de mes que cambia el modo de visualización a meses o años. ¿Hay una propiedad CSS específica que necesito o necesitaría editar un código en la biblioteca?

modo de vista normal

modo de vista superpuesto

 function AddDateTimeControl(parent, control, rowIndex, controlIndex) { var dateTimeID = "datetimepicker" + controlIndex; var tooltipDiv = CreateTooltipDiv(); var tooltipSpan = CreateTooltipSpan(control.ToolTip); var label = CreateControlLabel(control); //var icon = CreateIcon('fa-calendar'); var icon = CreateIcon("calendar-alt-regular"); tooltipDiv.appendChild(label); tooltipDiv.appendChild(icon); tooltipDiv.appendChild(tooltipSpan); var dateDiv = document.createElement("div"); dateDiv.classList.add('input-group'); dateDiv.classList.add('date'); dateDiv.classList.add('date-time-control'); dateDiv.style.color = "black"; dateDiv.id = dateTimeID; var dateTextBox = document.createElement("input"); dateTextBox.type = "text"; dateTextBox.classList.add("form-control"); dateTextBox.value = control.RawValues[0]; MarkElementForSerialization(dateTextBox, rowIndex, control.ID, 0); var calControlSpan = document.createElement("span"); calControlSpan.classList.add('input-group-append'); //input-group-addon? //span -> fa-calendar? dateDiv.appendChild(dateTextBox); dateDiv.appendChild(calControlSpan); //input-group-addon parent.appendChild(tooltipDiv); parent.appendChild(dateDiv); $(dateDiv).datetimepicker(); $(dateDiv).data("DateTimePicker").sideBySide(true); $(dateDiv).data("DateTimePicker").date(new Date(Date.parse(control.RawValues[0]))); $(dateDiv).data("DateTimePicker").format("MM/DD/YYYY HH:mm"); $(dateDiv).data("DateTimePicker").icons({ time: "fa fa-clock-o", date: "fa fa-calendar", up: "fa fa-arrow-up", down: "fa fa-arrow-down", previous: "fa fa-chevron-left", next: "fa fa-chevron-right", today: "fa fa-clock-o", clear: "fa fa-trash-o" }); $(dateTextBox).on('click', function() { $(dateDiv).data("DateTimePicker").toggle(); }); }
over 4 years ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

Eso dependerá completamente del componente datetimepicker que esté utilizando.

Este te permite establecer la vista máxima:

 $(dateDiv).datetimepicker({ maxView: 1 })

Sin embargo, nunca se actualizó para admitir Bootstrap 4.

Desde entonces, ese selector ha quedado obsoleto en favor de eonasdan-bootstrap-datetimepicker , que tiene una opción para establecer la vista mínima , pero no la vista máxima . Tendría que profundizar en el código de esa versión si desea agregar esa opción.

Hay una versión más reciente del selector Eonasdan, ahora llamado tempus dominus , que actualmente se encuentra en versión alfa. Esa versión proporciona opciones para activar o desactivar las vistas individuales :

 $(dateDiv).tempusDominus({ display: { viewMode: 'date', components: { decades: false, year: false, month: false, date: true, hours: true, minutes: true, seconds: false } } })
over 4 years ago · Santiago Trujillo Denunciar

0

Terminé desactivándolo al deshabilitar el evento de puntero en el interruptor del selector de mes.

 th.picker-switch[title="Select Month"] { pointer-events: none; }
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda