Html Table column borders

dev support
1

I have a scrollable table and when there is no data in a row, there are no column borders. Is there a way around this?

OS: Win10
Java Version: ???
Tomcat Version: ???
Lucee Version: 5.3.4.78

2

No data in a row means there is no row in the HTML table and if there is no column data means there is a border available. This is what I did. Anything an I missing

<cfoutput>
    <cfset res = QueryNew("Id,value","integer,varchar",[[1,"value1"],[2,"value2"]] )>
    <table border="1">
        <tr>
            <td>id</td>
            <td>value</td>
            <td>empty column</td>
        </tr>
        <cfloop query="res">
            <tr>
                <td>#res.id#</td>
                <td>#res.value#</td>
                <td></td>
            </tr>
        </cfloop>
    </table>
</cfoutput>
3

Put a non breaking space &nbsp in all of the cells before the value. If there is no value the cell will appear blank but with the border

4

You could write a query checker to display “No Data found” if a query was empty. From a UI stand point it is better to tell the user there was no data, than have the user assume your program is broken and the pester someone to fix it.

5

I used javascript to add 2 rows and appropriate number of columns to the table and then filled in these new cells with data but no borders appeared, in fact all applicable CSS was not applied. So, I tried re-applying CSS to one cell with no success.

const xx = document.querySelector('.user');
xx.style['border-right'] = '2px solid black';
6

That is because there is no data to draw the cell for.

try adding a non breaking space to the cell.

7

There is data:

trial

8

This looks like a javascript/css problem. Are you able to directly change the borders through the browsers dev tool inspector? I’d guess your javascript isn’t selecting the dom element, or a css rule is breaking it.

9

The query is being done in a cfc, so, I modified the query to test the number of rows selected. If there were less than 4, I did the following (where 2 rows selected):

SELECT username, logondate, logontime
FROM prodndb.tblUsers
WHERE tblUsers.LogonDate <> ""
UNION
SELECT '&nbsp' as username,
		 '&nbsp' as logondate,
		 '&nbsp' as logontime
UNION ALL
SELECT '&nbsp' as username,
	      '&nbsp' as logondate,
	     '&nbsp' as logontime

Problem solved!