Forum Discussion

tsaho8's avatar
tsaho8
Cloud Apps
03-14-2023
Solved

Custom color for pivot table header

Hi Team,

I want to give background color and text color of the header in bellow screenshot.

 

 

5 Replies

Replies have been turned off for this discussion
  • Hi tsaho8 ,

     

    Please try this script

    widget.on('domready', function(sender, ev){
    	
    //header columns
     var $ps1 = $(".p-grand-total-head", element);
    	$(".p-dim-head").css({'text-align' :'center','font-weight' : 'bold','color' : '#132f57','background-color' :'#e2e9ec','vertical-align': 'middle', 'wrap': 'true','font-size':'12px'}); 
    	$(".p-dim-member").css({'text-align' :'left','font-weight' : 'bold','color' : '#132f57','vertical-align': 'middle', 'wrap': 'true'}); 
    	$('.p-head-content, .p-value,#title_span').css('white-space','normal') // word wrap
    
    
    	//var $ps2=$(".p-value")
    	
     $ps1.css('font-size' , '12px');
     $ps1.css('font-weight' , 'bold');
     $ps1.css('color' , '#132f57');
     $ps1.css('background-color' , '#e2e9ec');
     $ps1.css('text-align' , 'center'); 
    $ps1.css('vertical-align' , 'middle');  //phantom
    	
    	
    		// remove last blank td	
     var tags = $('td.phantom', element);
     for(var i=0; i<tags.length; i++) {
      tags[i].style.width = '0px';
     }
    	
    
    	
    
    	$('td.p-total-row-val,td.p-total-row-head,td.p-total-row-head, td.p-total-row-val, td.p-grand-total-row-head,td.p-value,td.p-last-row-col', 'widget[type=pivot]').css({'border-bottom':'thin solid #DCDCDC', 'wrap': 'true'});
    		 
     $(' td.p-grand-total-row-head,td.p-colored', 'widget[type=pivot]').css({'font-weight' :'bold','color':'#132f57', 'wrap': 'true'});
    
    });

     

    Thanks

    Sijo

    • tsaho8's avatar
      tsaho8
      Cloud Apps

      Hi Sijo,

      I have tried above script but no luck. Please suggest?

      Regards,

      Tulu

  • Hi tsaho8 ,

    which version of Sisense your using on which OS (windows or Linux)? As those may vary in the approach for script building, especially on Pivot side. Also are you planning to do it for both Pivot/Table?

    At QBeeQ we develop a wide range of plug-ins, and of them is our Expandable Pivot that has the feature your are looking for built-in alongside many other powerful features, like Transpose, Viewers ability to change columns/rows/values displayed and many more. This is a very powerful Self-Service plug-in that allows Viewers to design their own views in Pivot and elevate them to next level of analytics!

    We are also on verge of releasing enhanced table with aggregation, which will incorporate design capabilities as well.

    Feel free to reach out for a live demo and free trial, we're always here to help,

    Always here to help,
    Michael from QBeeQ

    QBeeQ - Gold Implementation and Development Partner
    www.qbeeq.io 

    • tsaho8's avatar
      tsaho8
      Cloud Apps

      Hi Alek,

      Your solution is amazing.

      I want to create one landing page for my report and will give the navigation action to move to different dashboard from landing page. How will create this landing page for my report?