Project

General

Profile

Defect #693

table borders not working as expected

Added by Jos de Bruijn almost 12 years ago. Updated almost 12 years ago.

Status:
Closed
Priority:
Normal
Assignee:
-
Category:
-
Target version:
-
Start date:
Due date:
% Done:

0%

Estimated time:
Browser (if web client):

Description

I've got a table with the following styling:
.data td {
border-bottom: 1px solid black;
}
When I view this in continuous view this results in a single black line. But when I show the report in paginated view and when I save to PDF I get an interrupted line. There seems to be a spacing between the cells. I'm using the same css file from the sample report of the plugin.
I'm sure it is some styling property that I'm overlooking, I just can't find it.

Files

vel_reports.zip (2.39 KB) vel_reports.zip template and test html file, both use same css file Jos de Bruijn, 06/03/2013 02:49 PM

History

#1

Updated by Patrick Talbot almost 12 years ago

  • Status changed from New to In Progress

If you are using a style similar to the demo template, this is expected, because in the style with media="print" you have the property:

table {
    -fs-table-paginate: paginate;
}

which will allow table headers to automatically be put on top of new pages when a table is cut by a page break but also turns off the property:
table {
    border-collapse: collapse;
}

And since you are putting your border on td only you see the natural gaps you have when your tables are not in collapse style.
You should try and get rid of -fs-table-paginate: paginate; and put your border on .data tr instead (but be warned that you will lose the repetition of table headers on page breaks).

#2

Updated by Jos de Bruijn almost 12 years ago

When I set the tr border property it does nothing in Velocity.
I've tried it in a sample html page and then it works, do need i to set additional properties for this to work in velocity?
i've included my template and test page.
And my code looks like this: 

    var template = "listTemplate.html" 
    previewParams = {
        showToolBar: true,
        showStatus: true,
        useTogglePaginated: false,
        openInPaginated: true,
        usePrint: true        
    };
    plugins.VelocityReport.setDefaultPreviewParameters(previewParams);
    /** @type {{objects: Array}}*/
    var context = getListContext();
    if(context.objects.length == 0) {
        var _title = i18n.getI18NMessage('servoy.general.info');
        var _message = i18n.getI18NMessage('pronto.msg.report.nodata');
        globals.DIALOGS.showInfoDialog(_title,_message)
    }else{
        viewer = plugins.VelocityReport.previewReport(template, context, webMode);
    }

#3

Updated by Jos de Bruijn almost 12 years ago

I just noticed that it does work as expected when I change the style to:

.data tr td{
    border-bottom: 1px solid #c0c0c0;
}

#4

Updated by Patrick Talbot almost 12 years ago

Another possible workaround for this is to use:

table {
    -fs-table-paginate: paginate;
    border-spacing: 0;
}

@see http://stackoverflow.com/questions/10512324/css-to-pdf-the-css-in-flying-saucer-fs-table-paginate-result-in-border-collap for more info on this issue and possible workarounds.

#5

Updated by Patrick Talbot almost 12 years ago

  • Status changed from In Progress to Closed

If the xHTMLRenderer lib actually fixes its own bug, I'll implement it as well, but in the meantime this is not something that can be fixed at the plugin level, so I'm closing this one for now as there are workarounds available.

Also available in: Atom PDF