KB Article 15997
2019/01/31

Close
X
Contact Tech Support

 Email Tech Support
 (250) 655-1766
 [7:30 - 5:00 PST]
Your Meeting ID will be Provided by a Rep.
Tech Support
Tech Support Home
Software Updates
Knowledge Base Search
Recent KB Articles
Product FAQs
Code Samples
Documentation
Tech Blog
System Requirements
Installation Instructions
Support Testimonials
Contact us to...
Create a Ticket
Request a Free Demo
Suggest a New Feature
Submit Feedback
Upload a Large File
Other Services
Software Training
Professional Services

What do I do if my Table's Header's do not line up with the columns data?

Product: Presto Type: Frequently Asked Question

Sometimes we come across tables in Presto where the headers don't line up exactly with the column data beneath them and, in some cases, a header may actually overlap with data from a separate column. Usually this is just because of how the greenscreen program itself was written. One could change this in the underlying program but there are ways one could handle this in Presto itself:

1.   The easiest solution is to define a custom table and base the columns off of the data. In the visual editor one can then select the headers and manually change the text to reflect whatever you want them to be.

2.   But sometimes if the table header is empty you can't select it. In that case you can use the following javascript to change the table header text. In custom.js add:

/***
Function: ModifyTableHeader
Purpose: Easily modify AutoTable Headers
Parameters: Obj
Example Obj:
var oHeaderObject =
{

0: {cells: {1: '1st row, 2nd Cell', 2: '1st row, 3rd Cell'}},
1: {cells: {0: '2nd row, 1st Cell', 1: '2nd Row, 2nd Cell'}}

}
Where each Array element is an object specifying the index and
text of the cell to be converted.
Example call: ModifyTableHeader(oHeaderObject);
***/

function ModifyTableHeader(oHeaderObject)
{

jQuery(".AutoTable tr:has(th)").each(function(nRowIndex)
{

jQuery(this).children('th').each(function(nCellIndex)
{

if(oHeaderObject[nRowIndex] && oHeaderObject[nRowIndex].cells[nCellIndex])
{

jQuery(this).children('span').html(oHeaderObject[nRowIndex].cells[nCellIndex]);

}

});

});

}

And then in your page level javascript add something like:

jQuery(document).one("PageComplete", function()
{

var oHeaderObject =
{

0: {cells: {1: '1st row, 2nd Cell', 2: '1st row, 3rd Cell'}},
1: {cells: {0: '2nd row, 1st Cell', 1: '2nd Row, 2nd Cell'}}

}

ModifyTableHeader(oHeaderObject);

});

If you have any questions about this don't hesitate to reach out to Technical Support.

Rate This Article

Did this example help you to achieve your goal?
 Yes  No  Don't Know

Enter additional comments below.   If you want to hear back from us, include your contact information.

Email Address:
Comments:
Please enable JavaScript in order to rate this page.