We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Customize Cell


We are using the "oneventRendered" event to customize the default cell text, the formatting goes away, is there a way to auto grow the cell size and wrap text if the contents wont fit ? We are setting the text via args.elements.innerHTML

Also what is the best way to customize the tooltip, we need to display a couple of short paragraphs via tooltip window.


1 Reply

VM Vengatesh Maniraj Syncfusion Team January 10, 2020 07:02 AM UTC

Hi Umair Ahmed, 
Greetings from Syncfusion Support. 
Q1: We have prepared a sample based on your shared scenario by applying the CSS styles, which can be viewed from the below sample link, 
.template-wrap { 
  white-space: normal; 
Q2: It is possible to customize the display of needed event information on tooltip by making use of the tooltipTemplate option within the eventSettings like below, 
public eventSettings: EventSettingsModel = { 
        dataSource: eventsData, 
        enableTooltip: true, 
<ng-template #eventSettingsTooltipTemplate let-data> 
        <div class="tooltip-wrap"> 
          <div class="content-area"> 
            <div class="name">{{data.Subject}}</div> 
            <div *ngIf="data.City != null && data.City !=undefined"> 
              <div class="city">{{data.City}}</div> 
            <div class="time">From&nbsp;:&nbsp;{{data.StartTime.toLocaleString()}} </div> 
            <div class="time">To&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:&nbsp;{{data.EndTime.toLocaleString()}} 
Kindly try the above sample and revert us for further assistance with this. 


Live Chat Icon For mobile
Up arrow icon