Question

我想要做的是在用户点击引导程序崩溃按钮后显示特定订单的详细信息。

下面的图片将向您展示我期望的解决方案。

点击按钮之前：

点击按钮后我想要的理想解决方案：

但是我没有这个结果（这是我的问题，每个td元素只在一行中）：

HTML：

<div class="container">
<h1>My Orders</h1>
<h3>Total orders: {{$orders->total()}}</h3>
<table class="table table-striped">
    <thead>
    <tr>
        <th class="col-sm-4">Order Id</th>        
        <th class="col-sm-4">Total Paid</th>
        <th class="col-sm-2">Order Date/Time</th>
    </tr>    
    </thead>
    <tbody>
    @foreach($orders as $keyo => $item)
        <tr style="width: 100%;">
            <td>{{$item->id}} <button class="btn btn-success fa fa-eye" type="button" data-toggle="collapse" data-target="#viewmyorder{{$keyo}}" aria-expanded="false" aria-controls="collapseExample"></td>            
            <td>{{ number_format($item->total_paid,2,',','') }} &euro;</td>
            <td>{{$item->created_at}}</td>            
        </tr>     
        <tr id="viewmyorder{{$keyo}}" class="collapse" style="width: 100%;">
            <?php $orderitemtable = \App\OrderItem::all()->where('order_id', $item->id); ?>
            @foreach($orderitemtable as $theitems)
                <?php $findproducts = \DB::table('products')->select('id', 'name', 'code', 'price')->where('id', $theitems->product_id)->get(); ?>
            @foreach($findproducts as $pr)                          
                <td class="col-md-1">{{$pr->name}}</td>
                <?php $findphoto = \App\Photo::where('product_id', $pr->id)->get()->first(); ?>             
                <td class="col-md-4"><img src="/{{$findphoto->show_path}}"></td>                            
                <td class="col-md-1">{{$pr->code}}</td>
                <td class="col-md-1">{{$pr->price}}</td>            
                @if($theitems->order_condition == 0)
            <td class="col-md-2">Condition Order: Is in proccess</td>
            @elseif($theitems->order_condition == 1)
            <td class="col-md-2">Condition Order: We haven't enough items</td>
            @elseif($theitems->order_condition == 2)
            <td class="col-md-2">Condition Order: Order Completed</td>
            @endif  
            @if(($theitems->order_comments != null)== true)     
            <td class="col-md-3">{{$theitems->order_comments}}</td>
            @else
            <td class="col-md-3">No comments in this item</td>
            @endif          

            @endforeach    

            @endforeach

        </tr> 
    @endforeach

    </tbody>
</table>
</div>

Answer 1

您可以将折叠用于折叠表行。这是最好的例子。 http://www.bootply.com/fdTMNTiLis

桌子内的Bootstrap崩溃与Laravel

1 个答案: