Display data in the table

Asked

Viewed 299 times

3

I am trying to present these items in this way: Tabela 1

However after several attempts the table always remains so: Tabela 2

How should I make the table to get this result?

View

<h2>Apagar evento</h2>
<br>
<table border="1" width "100px" bordercolor="#e2e2e2"  style="word-wrap: break-word" cellpadding="10px">
<tr>
    <?php
    $i=0;
    foreach( $showbills as $showbill ):?>

        <th colspan="2" scope="col">
            <?php echo $this->Form->postLink('Apagar Evento', array('controller'=> 'showbills', 'action'=>'admin_del_event', $showbill['Showbill']['id_showbill']), array('class'=>'event_del', 'title'=>'Apagar Evento'),__('Tem a certeza que quer apagar este Evento?'));?>
        </th>

    <tr>
        <td style="display:inline-block">
            <?php echo $showbill['Showbill']['title'];?>
        </td>
        <td style="display:inline-block">
            <?php echo $this->Html->image('showbill/' . $showbill['Showbill']['image'], array('width' => '189px', 'height' => '267px', 'alt' => $showbill['Showbill']['image']));?>

        </td>
    </tr>
    <?php
        $i++;
        if($i==3){
            echo "</tr><tr>";
            $i=0;
        }
    ?>
    <?php endforeach ?>
</tr>

</table>
  • Looks like there’s a syntax error here <?php&#xA; $i=0;&#xA; foreach( $showbills as $showbill ):?> I think the right thing would be to ; <?php&#xA; $i=0;&#xA; foreach( $showbills as $showbill );?>

  • No, he’s right this way too.

  • I recommend you to do this without table, mainly because it is dynamic data, soon I show an example of how would look html and css to solve your problem

2 answers

2


Ideal for these cases is to use and

your View would look like this:

<?php foreach( $showbills as $showbill ):?>
<div class="events">
    <div class="title">
        <?php echo $this->Form->postLink('Apagar Evento', array(
            'controller'=> 'showbills', 
            'action'=>'admin_del_event', 
            $showbill['Showbill']['id_showbill']
        ), array(
            'class'=>'event_del', 
            'title'=>'Apagar Evento'
        ),__('Tem a certeza que quer apagar este Evento?'));?>
    </div>
    <div class="text"><?php echo $showbill['Showbill']['title'];?></div>
    <div class="image"> 
        <?php echo $this->Html->image('showbill/' . $showbill['Showbill']['image'], array(
            'width' => '189px', 
            'height' => '267px', 
            'alt' => $showbill['Showbill']['image']
        ));?>
    </div>
</div>
<?php endforeach ?>

And add the following to your :

.events {
    width: 300px;
    float: left;
    margin: 0;
    border: 1px solid #ccc;
}

.title {
    color: blue;
    margin: 0;
    padding: 5px;
    border-bottom: 1px solid #ccc;
}

.text {
    width: 140px;
    float: left;
    margin: 0;
    padding: 5px;

}

.image {
    width: 139px;
    float: left;
    margin: 0;
    padding: 5px;
    border-left: 1px solid #ccc;
}

The class event should be exactly 1/3 the size of your content area. You can replace the fixed value by 33%, this way the layout adapts to the device screen d.

Another option would be to use to better organize your view.

I recommend reading this article

  • I just added one more <div>, which contains these, to make the space to present them. Thank you also for the article, which is quite useful!

0

A good tip is to use bootstrap, it is a css framework, very easy to use and for free (http://getbootstrap.com/2.3.2/index.html)

After adding the framework, you do so:

<div class="row-fluid">
  <div class="span4">imagem 1</div>
  <div class="span4">imagem 2</div>
  <div class="span4">imagem 3</div>
</div>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.