Advice on how to set column widths in php

In summary, the column widths in the raceResults table are dependent on the name field. If the name is shorter than 25 characters, then the field is truncated. The php code to display the table is displayed below, but the code needs to be amended to fix the column widths.
  • #1
Robbie8
3
0
Postby Robbie8 » Mon Sep 03, 2012 7:44 pm
Hi,
I am using a php view to show a table of all the entrants in my projects with their number, name, rounds and points.

I have two projects Project One and Two which have their results displayed in tables. The width of the columns for the values in these projects are dependent on the size of the name of the person, or club or points, making the table views slightly offset. The data records are read from a mysql database tables

i.e if the name is Fred Bloggs then the name column is only 11 characters wide, whereas if the name is Frederick Wilkinson then the column is 20 characters wide.
If Fred Bloggs is in project one and Frederick Wilkinson is in Project two, then when they are viewed on the web page then the Table for Project one is not as wide as for project two, making them look offset and not professional.

I would like to be able to define the width of each field, so as an example let's say the name field to be 25 characters and be padded with blanks if the name is shorter. Yes I understand that if the name was 26 characters it would be truncated and accept that, but as my individuals are fixed, I can live with that.

The php code is displayed below, but I don't know how to amend it to fix the column widths and would really appreciate some advice.

--

<?php
defined('_JEXEC') or die('Restricted access'); ?>

<div id="Plans">

<h1><?php echo $this->title; ?></h1>

<table class="raceResults" cellspacing="0" cellpadding="0" summary="">
<thead>
<tr>
<th><?php echo JText::_('COM_Plans_POSITION_SHORT' ); ?></th>

<?php if ($this->params->get('shownumber')): ?>
<th><?php echo JText::_('COM_Plans_NUMBER_SHORT' ); ?></th>
<?php endif; ?>

<th><?php echo JText::_('COM_Plans_Individual' ); ?></th>

<?php if ($this->params->get('showteams')): ?>
<th><?php echo JText::_('COM_Plans_Team' ); ?></th>
<?php endif; ?>

<?php foreach ($this->rounds as $r): ?>
<th colspan="<?php echo count($r->subrounds); ?>" class="hasTip" title="<?php echo $r->round_name; ?>"><?php echo substr($r->short_name, 0, 6); ?></th>
<?php endforeach; ?>

<th><?php echo JText::_('COM_Plans_Points' ); ?></th>
</tr>
</thead>
<tbody>
<?php
$i = 0;
foreach( $this->rows AS $ranking )
{
$link_ind = JRoute::_( PlansHelperRoute::getIndividualRoute($ranking->slug, $this->project->slug) );
$link_team = JRoute::_( PlansHelperRoute::getTeamRoute($ranking->teamslug, $this->project->slug) );
?>
<tr class="<?php echo ($i ? 'd1' : 'd0'); ?>">
<td><?php echo $ranking->rank; ?></td>

<?php if ($this->params->get('shownumber')): ?>
<td><?php echo $ranking->number; ?></td>
<?php endif; ?>

<td>
<a href="<?php echo $link_ind; ?>"
title="<?php echo JText::_('COM_Plans_Details' ); ?>">
<?php echo $ranking->first_name . ' ' . $ranking->last_name; ?>
</a>
</td>
<?php if ($this->params->get('showteams')): ?>
<td>
<?php if ($ranking->team_id): ?>
<a href="<?php echo $link_team; ?>"
title="<?php echo JText::_('COM_Plans_Details' ); ?>">
<?php echo $ranking->team_name; ?></a>
<?php endif; ?>
</td>
<?php endif; ?>

<?php $i = 1;?>
<?php foreach ($this->rounds as $round): ?>
<?php foreach ($round->subrounds as $subround): ?>
<td><?php echo isset($ranking->results[$subround->subround_id]) ? $ranking->results[$subround->subround_id] : '-'; ?></td>
<?php endforeach; ?>
<?php endforeach; ?>

<td><?php echo $ranking->points; ?></td>

</tr>
<?php
$i = 1 - $i;
}
?>
</tbody>
</table>
<p class="copyright">
<?php echo HTMLplans::footer( ); ?>
</p>
</div>
 
Technology news on Phys.org
  • #2
Something along the lines of the following should work:

Code: 
<?php
function getColWidth($colName)
{
/* add code to get the correct column width for the given column name and store
 it in a variable named colWidth */
echo "width:" . $colWidth
} 
?>

<table>
  <tr class="<?php echo ($i ? 'd1' : 'd0'); ?>">
    <td style="<?php echo htmlspecialchars(getColWidth("rank")); ?>">
      <?php echo $ranking->rank; ?>
    </td>
    <?php if ($this->params->get('shownumber')): ?>
      <td style="<?php echo htmlspecialchars(getColWidth("number")); ?>">
        <?php echo $ranking->number; ?>
      </td>
    <?php endif; ?>
  </tr>
</table>
 
  • #3
Hi,
Thankyou for your advice. I added the code as I think you advised but it is giving me the following error - Perhaps you could have a look at the code that I added and advise me where I have made the error.

--
Error Message :
Fatal error: Cannot redeclare getcolwidth() (previously declared in /mylocation/public_html/myfile/tmpl/default.php:50) in /mylocation/public_html/myfile/tmpl/default.php on line 50
--

The Full code I have now coded is below, with the addition as I thought you had advised.

----------

defined('_JEXEC') or die('Restricted access'); ?>

<div id="Plans">

<h1><?php echo $this->title; ?></h1>

<table class="raceResults" cellspacing="0" cellpadding="0" summary="">
<thead>
<tr>
<th><?php echo JText::_('COM_PLANS_POSITION_SHORT' ); ?></th>

<?php if ($this->params->get('shownumber')): ?>
<th><?php echo JText::_('COM_PLANS_NUMBER_SHORT' ); ?></th>
<?php endif; ?>

<th><?php echo JText::_('COM_PLANS_Individual' ); ?></th>

<?php if ($this->params->get('showteams')): ?>
<th><?php echo JText::_('COM_PLANS_Team' ); ?></th>
<?php endif; ?>

<?php foreach ($this->rounds as $r): ?>
<th colspan="<?php echo count($r->subrounds); ?>" class="hasTip" title="<?php echo $r->round_name; ?>"><?php echo substr($r->short_name, 0, 6); ?></th>
<?php endforeach; ?>

<th><?php echo JText::_('COM_PLANS_Points' ); ?></th>
</tr>
</thead>
<tbody>
<?php
$i = 0;
foreach( $this->rows AS $ranking )
{
$link_ind = JRoute::_( PlansHelperRoute::getIndividualRoute($ranking->slug, $this->project->slug) );
$link_team = JRoute::_( PlansHelperRoute::getTeamRoute($ranking->teamslug, $this->project->slug) );
?>
<?php
function getColWidth($colName)
{
/* add code to get the correct column width for the given column name and store
it in a variable named colWidth */
echo "width:" . $colWidth
}
?>
<tr class="<?php echo ($i ? 'd1' : 'd0'); ?>">
<td style="<?php echo htmlspecialchars(getColWidth("rank")); ?>">
<td><?php echo $ranking->rank; ?></td>

<?php if ($this->params->get('shownumber')): ?>
<td style="<?php echo htmlspecialchars(getColWidth("number")); ?>">
<td><?php echo $ranking->number; ?></td>
<?php endif; ?>

<td>
<a href="<?php echo $link_ind; ?>"
title="<?php echo JText::_('COM_PLANS_Details' ); ?>">
<td style="<?php echo htmlspecialchars(getColWidth("first_name")); ?>">
<td style="<?php echo htmlspecialchars(getColWidth("last_name")); ?>">
<?php echo $ranking->first_name . ' ' . $ranking->last_name; ?>
</a>
</td>
<?php if ($this->params->get('showteams')): ?>
<td>
<?php if ($ranking->team_id): ?>
<a href="<?php echo $link_team; ?>"
title="<?php echo JText::_('COM_PLANS_Details' ); ?>">
<?php echo $ranking->team_name; ?></a>
<?php endif; ?>
</td>
<?php endif; ?>

<?php $i = 1;?>
<?php foreach ($this->rounds as $round): ?>
<?php foreach ($round->subrounds as $subround): ?>
<td><?php echo isset($ranking->results[$subround->subround_id]) ? $ranking->results[$subround->subround_id] : '-'; ?></td>
<?php endforeach; ?>
<?php endforeach; ?>

<td><?php echo $ranking->points; ?></td>

</tr>
<?php
$i = 1 - $i;
}
?>
</tbody>
</table>
<p class="copyright">
<?php echo HTMLPlans::footer( ); ?>
</p>
</div>

------
Thanks for your help again

Rob.
 
  • #4
Please use code tags for your code, it makes it easier to read.

Anyways, you should notice that what I gave you was just pseudo-code, you aren't meant to just copy and paste it into your code. In the function getColWidth, I've put comments telling you what to program... you will need to actually program it for the code to work.

I would suggest making the function a member of your "ranking" class (which means putting the code for the function inside your class definition, wherever that may be), so that you can easily process the data in your ranking object in order to determine what each column with should be.
 
  • #5
Hi,
I have sussed the problem by coding the following into my code - this is giving me what I need and I have tested all of the possibilities and it works as I need it to.

<td width="5px"> etc

to each field
 
  • #6
Robbie8 said:
Hi,
I have sussed the problem by coding the following into my code - this is giving me what I need and I have tested all of the possibilities and it works as I need it to.

<td width="5px"> etc

to each field

That will definitely work, but it is pretty static. I thought your aim was to determine the column widths at runtime on your PHP server, based on the length of data you are outputting in each column.
 
  • #7
I can be missing something, but from what I see this is not a php problem, but html problem. And if such a static solution suits you, it would be probably better to use css to format the table using a single class than to format each field separately.
 
  • #8
Borek said:
I can be missing something, but from what I see this is not a php problem, but html problem. And if such a static solution suits you, it would be probably better to use css to format the table using a single class than to format each field separately.

In addition to this, the width attribute of the <td> tag was deprecated in HTML 4.01, so you should really be using CSS styles instead,which will work in HTML5 as well. Also, its not usually best practise to use pixels to specify widths. I would use either a percentage of the total table width, or an em.

Rather than trying to specify column widths at the table level with a CSS class, I would use <colgroup>, with something like:

Code: 
<colgroup>
<col style="width:30%">
<col style="width:10%">
<col style="width:20%">
<col style="width:40%">
</colgroup>

for a static solution. For a dynamic solution, you would set the width of each column with a call to a PHP function or methd, or just using a PHP variable.
 

FAQ: Advice on how to set column widths in php

What is the importance of setting column widths in php?

Setting column widths in php is important because it allows for a more organized and visually appealing layout of data on a web page. It also helps to ensure that the data is displayed correctly and consistently across different devices and screen sizes.

2. How do I set column widths in php?

To set column widths in php, you can use the width attribute in the HTML <td> tag. Alternatively, you can use CSS to set the width of the columns by targeting the <td> or <th> elements and applying a width property.

3. Should I set column widths in pixels or percentages?

It is recommended to set column widths in percentages rather than pixels, as this allows for a more responsive design. This means that the columns will adapt to the size of the screen, making the layout more user-friendly for different devices.

4. Is it necessary to set column widths for every column in a table?

No, it is not necessary to set column widths for every column in a table. You can choose to only set widths for certain columns that require it, such as columns with a lot of data or columns that need to be a specific size for design purposes.

5. How do I ensure that my column widths are consistent across different browsers?

To ensure consistency across different browsers, it is important to test your website on multiple browsers and devices. You can also use CSS resets to remove any default styles that browsers may apply, and use CSS prefixes for certain properties to ensure they are interpreted correctly across different browsers.

Hot Threads

Recent Insights

Back
Top