from 2 modals, open one modal base on if else condition-CodePudding

I have 2 modals (Modal1 & Modal2), in table after clicked on action button "edit" base on data, i need to open any one modal. Say if age is less than 36 months then Modal 1 Else Modal 2 should open. Both modals have few data common and few are added newly.

This is my table code

<table id="cowcalfsummery"  style="width:100%">
                                                <thead>
                                                        <tr>
                                                        <th>ID</th>
                                                            <th>Breed Type</th>
                                                            <th>Gender</th>
                                                            <th>Birth Date</th>
                                                            <th>Weight (Kg)</th>
                                                            <th>Age (in Months)</th>
                                                            <th>Maturity Date</th>
                                                            <th>Health Status</th>
                                                            <th>Action</th>
                                                        </tr>
                                                    <tbody>
                                                        @foreach ($cowcalfdata as $item )
                                                        <tr id="item{{$item->id}}">
                                                            <td>{{$item->calfID}}</td>
                                                            <td>{{$item->breedtype}}</td>
                                                            <td>{{$item->gendertype}}</td>
                                                            <td>{{ date('d-m-Y', strtotime ($item->birthdate) ) }}</td> 
                                                            <td>{{$item->weight}}</td>
                                                            <td>{{$item->age}}</td>
                                                            <td>{{ date('d-m-Y', strtotime ($item->maturitydate) ) }}</td>
                                                            <td>{{$item->health}}</td>
                                                            <td>
                                                                <a  href="{{ route('viewCCalfbyid', ['Ccalfid' => $item->calfID]) }}" ><i  title="View"></i></a>
                                                                **<button type="button"**  data-info="{{$item->id}},{{$item->calfID}},{{$item->birthdate}},{{$item->age}},{{$item->breedtype}},{{$item->gendertype}},{{$item->health}},{{$item->status}},{{$item->color}},{{$item->weight}},{{$item->height}},{{$item->previousvaccinedone}},{{$item->maturitydate}}" data-toggle="modal" data-target="#editcowcalfmodal"><i  title="Edit"></i></button>
                                                                <button type="button"  data-cowcalfid="{{$item->calfID}}"><i  title="Delete"></i></button>

                                                            </td>
                                                        </tr>
                                                        @endforeach
                                                    </tbody>
                                                </thead>
                                            </table>

Thanks in Advance.

CodePudding user response：

You want to create a blade If statement and check if $item->age is below 36.

if it is you want to show the first button, else show the second button with a different data-target to your second modal.

@if($item->age < 36)
   <button type="button"
         
        data-info="
           {{$item->id}},
           {{$item->calfID}},
           {{$item->birthdate}},
           {{$item->age}},
           {{$item->breedtype}},
           {{$item->gendertype}},
           {{$item->health}},
           {{$item->status}},
           {{$item->color}},
           {{$item->weight}},
           {{$item->height}},
           {{$item->previousvaccinedone}},
           {{$item->maturitydate}}"
        data-toggle="modal" 
        data-target="#editcowcalfmodal">
              <i  title="Edit"></i>
    </button>
@else
   <button type="button"
         
        data-info="
           {{$item->id}},
           {{$item->calfID}},
           {{$item->birthdate}},
           {{$item->age}},
           {{$item->breedtype}},
           {{$item->gendertype}},
           {{$item->health}},
           {{$item->status}},
           {{$item->color}},
           {{$item->weight}},
           {{$item->height}},
           {{$item->previousvaccinedone}},
           {{$item->maturitydate}}"
        data-toggle="modal" 
        data-target="#MySecondModal">
              <i  title="Edit"></i>
    </button>
@endif

You also have your table wrong.

You first want to create a <thead> (table header). fill it with table titles, close the <thead> and after that you create the <tbody> (table body) with the content of the item.

This should create a structure like this:

<table>
   <thead>
      <tr>
         <th>Age</th>
         <th>Name</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>12</td>
         <td>Cow 1</td>
      </tr>
   </tbody>
</table>

More information about tables and how to use them