method - HTML en la cadena de título de fullcalendar jquery plugin

tooltip fullcalendar

Question

Creo que el jquery-plugin de fullcalendar es una solución realmente genial. Sin embargo, noté que el complemento escapa (htmlEscape) el título. Pero necesito formatear algunas cadenas en el título, por ejemplo, texto en negrita, colores o imágenes pequeñas.

La solución con otro complemento (por ejemplo, qTip, como en los ejemplos) no funcionará de la manera correcta para mí. ¿Hay alguna forma de formatear el texto del título?

Answer 1

Debido a que la clase CSS ha cambiado, esta es la respuesta correcta:

eventRender: function (event, element) {
    element.find(''.fc-title'').html(event.title);
}

Answer 2

He hecho así, compruebe el enlace.

eventRender: function (event, element) {
    element.find(''.fc-title'').html(event.title);/*For Month,Day and Week Views*/
    element.find(''.fc-list-item-title'').html(event.title);/*For List view*/
}

Answer 3

Hice esto en su lugar, ya que las otras vistas usan la misma clase pero no abarcan y forcé el título del evento en lugar de hacer una solicitud adicional para el texto.

eventRender: function (event, element) {
    element.find(''.fc-event-title'').html(event.title);
}

En v2, puedes usar:

element.find(''span.fc-title'').html(element.find(''span.fc-title'').text());

La clase span es fc-title en lugar de fc-event-title .

Crédito a j00lz por el comentario que confirma el cambio.

Answer 4

Tener fácilmente todos los html en los títulos de los eventos muestran que usé esto, lo hace muy fácil.

eventRender: function (event, element) {
    element.find(''span.fc-event-title'').html(element.find(''span.fc-event-title'').text());           
}

Lo que se encontró aquí http://code.google.com/p/fullcalendar/issues/detail?id=152

Answer 5

Terminé haciendo algo como esto para poner un enlace al lado del tiempo. Algo similar debería funcionar para el título:

    events: [
      <% @schedule.events.each do |event| %>
      {
        // Render your events here as needed
        // I added a custom attribute called eventDeleteLink, to be used below
      },
      <% end %>
    ],
    // Add this piece:
    eventRender: function(event, element) {
      element.find(".fc-event-time").append(" " + event.eventDeleteLink);
    }

Así que esto usa el apéndice () de jQuery para agregar un espacio en cualquier enlace de eliminación después del tiempo y funciona bien para cosas básicas.

Para lo que no funcionó (y para lo que me gustaría ver una solución, si alguien tiene una) es incluir código con comillas anidadas o comillas dobles. Por ejemplo, no pude agregar un desencadenador onClick debido a la necesidad (en mi caso) de comillas simples dentro de comillas dobles. No pude averiguar cómo escapar de ellos y no tener (lo que creo que es) un calendario completo re-escapándolos.

De todos modos, para texto básico, esto me funcionó.

Answer 6

        eventRender: function (event, element) {
            element.find(''.fc-title, .fc-list-item-title'').html("<b>"+event.title+"</b>");
        },