Laravel list edit

Question

I have a master detail listing. The master is the groups table, the detail is the hours one. I have problems with the edit module, I'm able to modify only the first row, suppose that is due the fact that the controls of the modal form have of course the same name, independent of the foreach cicle. When I call the form for each row and edit it, the controls in the form have always the first row values.

My view

    <table class="table">
      <thead class="thead-light">
        <tr>
          <th>Día</th>
          <th>Hora de inicio</th>
          <th>Hora de fin</th>        
          <th>Cambios</th>
       </tr>
      </thead>
      <tbody>

        @foreach($horarioPeriodicos as $horario)
          <tr>
            <td>  

              @switch( $horario->intDia )
                  @case( 1 )
                      Lunes
                    @break
                  @case( 2 )
                      Martes
                    @break
                  @case( 3 )
                      Miércoles
                    @break
                  @case( 4 )
                      Jueves
                    @break
                  @case( 5 )
                      Viernes
                     @break 
                  @case( 6 )
                      Sábado
                     @break 
                  @default
                      Domingo
                    @break
              @endswitch

            </td>
            <td> {{ $horario->timHoraInicio }} </td>
            <td> {{ $horario->timHoraFin }} </td>
            <td>
              <button class="btn btn-sm btn-outline-secondary"

              onclick="
                var resultdelete = confirm ('¿Estas seguro de que deseas borrar el horario?');
                  if (resultdelete)
                  {
                    event.preventDefault();
                    document.getElementById('delete-horario-form').submit();
                  }
              "


              >-</button>
                <form id="delete-horario-form" action="{{ route('horarioperiodicos.destroy',[$horario->idHorarioPeriodico])}}"
                  method="POST" style="display: none;">
                    <input type="hidden" name="_method" value="delete">
                    {{ csrf_field() }}
                </form>

               / 

              <!--<button class="btn btn-sm btn-outline-secondary">Editar</button>-->
              <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#edit-horario">Editar</button>

            <div class="modal fade" id="edit-horario" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" >
              <div class="modal-dialog" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <h5 class="modal-title" id="ModalLabel">Nuevo horario</h5>                      
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">&times;</span>
                    </button>
                  </div>

                  <!-- <form action="{{ route('horarioperiodicos.store',[$grupo->idGrupo]) }}" method="post">-->
                  <form method="post" action="{{ route('horarioperiodicos.update',[$horario->idHorarioPeriodico]) }}">
                    {{ csrf_field() }}
                    <input type="hidden" name="_method" value="put">
                    <div class="modal-body">
                      <input type="hidden" id="groupID" name="groupID" value= {{ $grupo->idGrupo }} >
                      <div class="form-group">
                        <label for="intDia" class="col-form-label">Día de la semana</label>
                        <select name="intDia" class="form-control">
                          <option value="1"  {{ 1 == $horario->intDia ? 'selected' : '' }}> Lunes</option>
                          <option value="2"  {{ 2 == $horario->intDia ? 'selected' : '' }}> Martes</option>
                          <option value="3"  {{ 3 == $horario->intDia ? 'selected' : '' }}> Miércoles</option>
                          <option value="4"  {{ 4 == $horario->intDia ? 'selected' : '' }}> Jueves</option>
                          <option value="5"  {{ 5 == $horario->intDia ? 'selected' : '' }}> Viernes</option>
                          <option value="6"  {{ 6 == $horario->intDia ? 'selected' : '' }}> Sábado</option>
                          <option value="7"  {{ 7 == $horario->intDia ? 'selected' : '' }}> Domingo</option>
                          </select> 
                      </div>
                      <div class="form-group">
                        <div style="width:50%;float:left;display:inline-block;">
                          <label for="timHoraInicio" class="col-form-label">Hora de inicio</label>
                          <input type="time" id="timHoraInicio" name="timHoraInicio" min="9:00" max="18:00" value= {{ $horario->timHoraInicio }} >
                        </div>
                        <div align="right">
                          <label for="timHoraFin" class="col-form-label">Hora de fin</label>
                          <input type="time" id="timHoraFin" name="timHoraFin" min="9:00" max="18:00" value= {{ $horario->timHoraFin }} >
                        </div>
                      </div>
                    </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
                    <button type="submit" class="btn btn-primary" id="submitForm">Guardar</button>
                  </div>
                  </form>
                </div>
              </div>
            </div> 


            </td>
          </tr>
        @endforeach


      </tbody>
    </table>

The update function at controller

public function update(Request $request, $id)
{
    //
        $horarioPeriodicosUpdate = horarioPeriodicos::where('idHorarioPeriodico', $id)->update
                ([
                'idGrupo'=>$request->input('groupID-'),
                'intDia'=>$request->input('intDia'),
                'timHoraInicio'=>$request->input('timHoraInicio'),
                'timHoraFin'=>$request->input('timHoraFin')
                ]);
    if ($horarioPeriodicosUpdate)
    {
/*            return redirect()->route('grupos.show',['grupos'=>$grupo->idGrupo])
            ->with('success', 'Grupo actualizado correctamente'); */
        return back()->withInput()->with('success','Horario actualizado exitosamente');                
    }

    return back()->withInput();

}

The edit work but only for the first row

The screen

Answer 1

If you are creating separate modals then why don't you name them with a unique id.

eg.

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#edit-horario-{{ $horario->id }}">Editar</button>

<div class="modal fade" id="edit-horario-{{ $horario->id }}" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" >