2

I am trying to create form inside table td in foreach loop of cakePHP, I want to form in only 3 table td and update it in. Also, it is working fine but only issue is with alignment of heading because of form inside td. If I take out form out pf td, it doesn't work

<table class="table table-hover ">
<thead>
<tr>
    <th>Customer</th>
    <th>Dress</th>
    <th>Order Date</th>
    <th>Delivery Date</th>
    <th>Status</th>
    <th>Tailor</th>
    <th>Tailor Cost</th>
    <th class="actions"><?php echo __('Actions'); ?></th>
</tr>
</thead>
<tbody>
<?php foreach ($orders as $order): ?>
    <tr>
        <td>
            <?php echo $this->Html->link($order['Customer']['name'], array('controller' => 'customers', 'action' => 'view', $order['Customer']['id'])); ?>
        </td>
        <td>
            <?php echo $this->Html->link($order['Dress']['type'], array('controller' => 'dresses', 'action' => 'view', $order['Dress']['id'])); ?>
        </td>
        <td><?php echo h(date('d-M-y',strtotime($order['Order']['order_date']))); ?>&nbsp;</td>
        <td><?php echo h(date('d-M-y',strtotime($order['Order']['delivery_date']))); ?>&nbsp;</td>
        <td><?php echo h($status[$order['Order']['status']]); ?>&nbsp;</td>
        **<td>
            <?php echo $this->Form->create('Order',['class'=>'form-inline']); ?>
            <?php echo $this->Form->input('id', ['type'=>'hidden','value'=>$order['Order']['id']]); ?>
            <?php echo $this->Form->input('user_id', ['empty'=>'--Select--','options'=>$users, 'selected'=>$order['User']['id'], 'div' => false, 'label' => false, 'class' => 'form-control']); ?>
            <?php echo $this->Form->input('tailor_price', ['value' =>$order['Order']['tailor_price'], 'div' => false, 'label' => false, 'class' => 'form-control','style'=>'max-width:140px;']); ?>
            <?php echo $this->Form->button(__('Update'), ['class' => 'btn btn-default']) ?>
            <?php echo $this->Form->end(); ?>
        </td>**
    </tr>
<?php endforeach; ?>
</tbody>

But it's breaking the table th and td alignment :

enter image description here

Please help me out. Thank you in advanced.

Asmita
  • 171
  • 1
  • 11
  • 1
    You used 8 columns in table header, but in table body you used only 6 - this is reason why it's not aligned. I think you should not use table element here - take a look at this question and answer: https://stackoverflow.com/questions/4035966/create-a-html-table-where-each-tr-is-a-form – Szymon Apr 26 '18 at 08:09
  • @Szymon's comment is the correct answer, the ones currently given below do produce invalid HTML. – ndm Apr 26 '18 at 09:03

2 Answers2

0

try this 

<?php echo $this->Form->create('Order',['class'=>'form-inline']); ?>
   <td>
            <?php echo $this->Html->link($order['Customer']['name'], array('controller' => 'customers', 'action' => 'view', $order['Customer']['id'])); ?>
        </td>
   <td>
            <?php echo $this->Html->link($order['Dress']['type'], array('controller' => 'dresses', 'action' => 'view', $order['Dress']['id'])); ?>
  </td>
  <td><?php echo h(date('d-M-y',strtotime($order['Order']['order_date']))); ?>&nbsp;</td>
  <td><?php echo h(date('d-M-y',strtotime($order['Order']['delivery_date']))); ?>&nbsp;</td>
        <td><?php echo h($status[$order['Order']['status']]); ?>&nbsp; 
  </td>
  <td>
       <?php echo $this->Form->input('id', ['type'=>'hidden','value'=>$order['Order']['id']]); ?>
       <?php echo $this->Form->input('user_id', ['empty'=>'--Select--','options'=>$users, 'selected'=>$order['User']['id'], 'div' => false, 'label' => false, 'class' => 'form-control']); ?>
   </td>
   <td>
       <?php echo $this->Form->input('tailor_price', ['value' =>$order['Order']['tailor_price'], 'div' => false, 'label' => false, 'class' => 'form-control','style'=>'max-width:140px;']); ?>
   </td>
   <td>
            <?php echo $this->Form->button(__('Update'), ['class' => 'btn btn-default']) ?>          
   </td>
<?php echo $this->Form->end(); ?>
Riyas Kp
  • 151
  • 10
0

your th and td are not equal th are 8 and td are only 6 (which is why your column are mixing)

<table class="table table-hover ">
<thead>
<tr>
    <th>Customer</th>
    <th>Dress</th>
    <th>Order Date</th>
    <th>Delivery Date</th>
    <th>Status</th>
    <th>Tailor</th>
    <th>Tailor Cost</th>
    <th class="actions"><?php echo __('Actions'); ?></th>
</tr>
</thead>
<tbody>
<?php foreach ($orders as $order): ?>
    <tr>
        <?php echo $this->Form->create('Order',['class'=>'form-inline']); ?>
        <td>
            <?php echo $this->Html->link($order['Customer']['name'], array('controller' => 'customers', 'action' => 'view', $order['Customer']['id'])); ?>
        </td>
        <td>
            <?php echo $this->Html->link($order['Dress']['type'], array('controller' => 'dresses', 'action' => 'view', $order['Dress']['id'])); ?>
        </td>
        <td><?php echo h(date('d-M-y',strtotime($order['Order']['order_date']))); ?>&nbsp;</td>
        <td><?php echo h(date('d-M-y',strtotime($order['Order']['delivery_date']))); ?>&nbsp;</td>
        <td><?php echo h($status[$order['Order']['status']]); ?>&nbsp;</td>
        <td>
            <?php echo $this->Form->input('id', ['type'=>'hidden','value'=>$order['Order']['id']]); ?>
            <?php echo $this->Form->input('user_id', ['empty'=>'--Select--','options'=>$users, 'selected'=>$order['User']['id'], 'div' => false, 'label' => false, 'class' => 'form-control']); ?>
        </td>
        <td>
            <?php echo $this->Form->input('tailor_price', ['value' =>$order['Order']['tailor_price'], 'div' => false, 'label' => false, 'class' => 'form-control','style'=>'max-width:140px;']); ?>
        </td>   
        <td>
            <?php echo $this->Form->button(__('Update'), ['class' => 'btn btn-default']) ?>
        </td>
        <?php echo $this->Form->end(); ?>
    </tr>
<?php endforeach; ?>
</tbody>
Arbaz Khan
  • 80
  • 8
  • this is the same answer I posted above. – Riyas Kp Apr 26 '18 at 08:29
  • Answers shouldn't be code only @RiyasKpYiideveloper And despite that both answers are technically wrong, because they produce invalid HTML. The `tr` element only allows `td`, `th`, `script` and `template` elements as children. Look at it with the inspector, you'll notice that the form is closed immediately, and that the input elements are placed outside of it. This only works by chance so to speak, as soon as the browsers become a little more strict, this will stop working. **https://stackoverflow.com/questions/5967564/form-inside-a-table** – ndm Apr 26 '18 at 08:44