0

Tengo un componente livewire con el cual creo un modal con inputs dinámicos, en este modal tengo un input estático y un botón para agregar mas inputs:

<div class="modal-body">
      <form>
           <div class="row">
                <div class="col-sm-12 col-lg-12">
                     <div class="form-group">
                          <label for="name">Indicador: 1</label>
                          <input type="text" name="name" class="form-control" required>
                     </div>
                </div>
           </div>             
           @foreach ($orderIndicadores as $index => $orderProduct)
           <div class="row">
               <div class="col-sm-12 col-lg-12">
                   <label for="indicador">Indicador</label>
               </div>

               <div class="col-sm-12 col-lg-12">
                   <div class="input-group">
                          <input type="text" name="indicador" class="form-control me-3" required
                          wire:model="orderIndicadores.{{$index}}.indicador">                                  
                          <button wire:click.prevent="removeIndicador({{$index}})"
                           class="btn btn-danger rounded-circle">H</i></button>
                    </div>
                            
                </div>
           <div>
           @endforeach
           <div class="col-span-6 sm:col-span-6 text-center">
               <button wire:click.prevent="addIndicador" class="btn btn-info rounded-circle my-2">+</button>
           </div>
       </form>
</div>

En mi componente tengo las funciones para crear y quitar los inputs, estas funciones están vinculadas con wire:click dentro de la vista en sus respectivos botones.

public $orderIndicadores = [];
public function addIndicador()
    {
        $this->orderIndicadores[] = ['indicador' =>''];
    }
public function removeIndicador($index)
    {
        unset($this->orderIndicadores[$index]);
        $this->orderIndicadores = array_values($this->orderIndicadores);
    }

Esto funciona bien, en la vista me agrega y elimina los inputs dinámicamente: introducir la descripción de la imagen aquí

Luego de agregar estos inputs dinámicos quiero guardarlos, para ello en el botón guardar del modal puse un wire:click="save", dentro del componente creé la función save, lo que se me ocurrió fue hacer un foreach de $orderIndicadores que es el array vinculado a los inputs, y dentro del foreach llamar al modelo Indicadores y guardar los campos mediante create.

public function save(){
        foreach($this->orderIndicadores as $indicador){
            Indicadores::create([
                'nombre' => $indicador,
                'proceso_vinculado' => 1
            ]);
        }
    }

Pero de esta forma no estoy teniendo en cuenta el input estático y de igual manera lo estoy haciendo mal ya que no me guarda los inputs dinámicos, me sale este error:

TypeError Argument 1 passed to Illuminate\Database\Grammar::parameterize() must be of the type array, int given

¿Cuál es la mejor manera de guardar estos inputs dinámicos y tener en cuenta el input estático mediante un componente livewire?

6
  • Como es tu relación de proceso e indicador? Commented el 1 abr. 2022 a las 16:21
  • @JulioGuerrero un proceso puede tener muchos indicadores, pero un indicador solo le puede pertenecer a un proceso, ese 'proceso_vinculado' es el id del proceso, solo lo dejé como un 1 entero por pruebas con los inputs dinámicos. Commented el 1 abr. 2022 a las 16:24
  • Podrías probar con el metodo createMany de eloquent. laravel.com/docs/9.x/eloquent-relationships#the-create-method Commented el 1 abr. 2022 a las 16:26
  • @JulioGuerrero agregando el createMany no funciona igual. Commented el 1 abr. 2022 a las 19:56
  • En que linea tienes el error que te lanza? Commented el 1 abr. 2022 a las 22:27

1 respuesta 1

0

Usé este ejemplo y funciona perfecto:

https://www.nicesnippets.com/blog/laravel-livewire-dynamically-add-or-remove-input-fields
2
  • Si bien este enlace puede responder a la pregunta, es mejor incluir las partes esenciales de la respuesta aquí y proporcionar el enlace como referencia. Las respuestas que son únicamente un enlace pueden dejar de ser válidas si la página vinculada cambia. - Desde revisión Commented el 17 may. 2022 a las 5:55
  • Tu respuesta podría mejorarse con información de apoyo adicional. Por favor, pulsa en editar para añadir más detalles, como citas o documentación, para que otros puedan confirmar que tu respuesta es correcta. Puedes encontrar más información sobre cómo escribir buenas respuestas en el centro de ayuda.
    – Comunidad Bot
    Commented el 17 may. 2022 a las 9:20

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.