Equal size of Column in a Table

Hello @hheyhey568

Please, let me know your code to generate the table.

Best regards.

Hello Team,
Following is the code. Need your help in how to make the lable of the table wrap text and should be of equal size column. Also is there a way to add gridlines to the table like horizontal and vertical lines.

‘(function(){
var table = ‘<table><thead><tr><th> Pipe NPS </th><th> Pipe ID </th><th> Submerged Height Required(m) </th></tr></thead>’;
table += ‘<tbody>’;

var values = [1.049,2.067,3.068,4.026,6.065,7.981,10.02,12,13.25,15.25,17.25,19.25,21.25,23.25,25.25,27.25,29.25,31.25,33.25,35.25,37.25,39.25,41.25,43.25,45.25,47.25];
for(var i in values)

var values1 = [1.315,2.375,3.5,4.5,6.625,8.625,10.75,12.75,14,16,18,20,22,24,26,28,30,32,34,36,38,40,42,44,46,48];
for(var i in values1)

var values2 = [1,2,3,4,6,8,10,12,14,16,18,20,22,24,26,28,30,32,34,36,38,40,42,44,46,48];
for(var i in values1)
{
var PipeID;
PipeID=PREC((values[i])*25.4/1000,5);

var PipeOD;
PipeOD=PREC((values1[i])*25.4/1000,5);

var PipeIDInch;

PipeIDInch=(values2[i]);

var CSArea;
CSArea=Math.PI/4*PipeID*PipeID;

var FlowRate;
if(fieldname65==”m3/hr”) FlowRate=fieldname64;
if(fieldname65==”US GPM”) FlowRate=fieldname64*0.22712470704;

var Velocity;
Velocity=(FlowRate/3600)/CSArea;

var FroudeN;
FroudeN=Velocity/POW(9.81*PipeID,0.5);

var Submerge;
Submerge=PipeOD*(1+2.3*FroudeN);

getField(68).setVal(PREC(Submerge,2));

var OutputS;

if(fieldname66==”m”) OutputS=Submerge;
if(fieldname66==”ft”) OutputS=Submerge*3.28084;
if(fieldname66==”inch”) OutputS=Submerge*3.28084*12;

OutputS = PREC(OutputS,2);
table += ‘<tr><td>’+PipeIDInch+'</td><td>’+PipeID+'</td><td>’+OutputS+'</td></tr>’;
}

table += ‘</tbody></table>’;
jQuery(‘.table-here2′).html(table);

return table;

})()’

• This reply was modified 2 years, 8 months ago by hheyhey568.

Hello @hheyhey568

Please, edit the piece of code:

var table = '<table><thead><tr><th> Pipe NPS </th><th> Pipe ID </th><th> Submerged Height Required(m) </th></tr></thead>';

as follows:

var table = '<table><thead><tr><th style="width:33%;"> Pipe NPS </th><th style="width:33%;"> Pipe ID </th><th style="width:33%;"> Submerged Height Required(m) </th></tr></thead>';

Best regards.

Thank you.

Is there a way to add lines also for the table? The horizontal and vertical lines in the table ?

Regards,

I mean to say how to add gridlines in the table? Thanks

Hello @hheyhey568

The tables include the grid by default. If your table does not display the lines, it is because there are styles on your website that hide them.

A possibility would be enter the style definition below through the “Customize Form Design” attribute in the “Form Settings” tab (https://resources.developers4web.com/cff/images/documentation/form-settings-tab.png):

#fbuilder table th,
#fbuilder table td{border:1px solid black !important;}

You can use a different border color if you prefer.

Best regards.

Thanks a lot. Perfectly working.

Is there any way to do the following:
When I click the row of the table , it highlight the whole row so easy to read the table.

Thank you,

regards,

• This reply was modified 2 years, 8 months ago by hheyhey568.