Problem with Dropzone in Laravel 10, it does not load to the db

65 Views Asked by At

From my client form I have placed a dropzone to upload multiple files, in my table the column is called Files, but when I send the form that column is empty. and the files were not sent to storage either.

I discovered that by commenting on the $rule check line the files uploaded from the dropzone are sent to the specified folder. but even so, that information is not saved in the database, only in the Files column.

Here I leave my part of my controller in the store function.

public function store(Request $request)
{
    
    // Eliminar el campo 'Files' del array $request antes de la validación
    $files = $request->input('Files');
    unset($request['Files']);

    // Validación para otros campos del formulario
    $request->validate(Aplicacione::$rules);

    // Restaurar el campo 'Files' después de la validación si existe
    $request['Files'] = $files;

    // Lógica para manejar la carga de los documentos
    $uploadedFiles = [];

    if ($request->hasFile('Files')) {
        foreach ($request->file('Files') as $file) {
            // Puedes agregar lógica específica para manejar documentos si es necesario

            // Ejemplo: Guardar el documento en una ubicación específica
            $fileName = $file->getClientOriginalName();
            $file->move(public_path('storage/files/'), $fileName);

            // Agregar el nombre del archivo a la lista de archivos cargados
            $uploadedFiles[] = $fileName;
        }
    }

    // Agregar los nombres de los archivos a la solicitud para almacenarlos en la base de datos
    $request['Files'] = $uploadedFiles;
    dd($request->all());

    // Lógica para manejar la carga de las firmas como imágenes
    $folderPath = public_path('storage/upload/');

    // Manejar la firma del propietario
    $ownerSignature = $request->input('OwnerSignature');
    $this->handleSignature($ownerSignature, $folderPath, 'owner_signature');

    // Manejar la firma del segundo propietario
    $owner2Signature = $request->input('Owner2Signature');
    $this->handleSignature($owner2Signature, $folderPath, 'owner2_signature');

    // Crear una nueva instancia de Aplicacione con los datos del formulario
    $aplicacione = Aplicacione::create($request->all());

    return redirect()->route('aplicaciones.index')
        ->with('success', 'Aplicacione created successfully.');
}

if I comment this

$request->validate(Aplicacione::$rules);

Dropzone sends me the files to the indicated path, but it does not save information in the db.

This is part of my model.

    class Aplicacione extends Model
{
    
    static $rules = [
        'LegalBusinessName' => 'required',
        'bda' => 'required',
        'TaxID' => 'required',
        'BusinessClass' => 'required',
        'Street' => 'required',
        'City' => 'required',
        'State' => 'required',
        'ZipCode' => 'required',
        'BusinessPhone' => 'required',
        'ProductsSold' => 'required',
        'Email' => 'required',
        'OwnerName' => 'required',
        'Ownertreet' => 'required',
        'OwnerCity' => 'required',
        'OwnerState' => 'required',
        'OwnerZipCode' => 'required',
        'OwnerHomePhone' => 'required',
        'OwnerCellPhone' => 'required',
        'OwnerLicense' => 'required',
        'OwnerSocial' => 'required',
        'CurrentCash' => 'required',
        'OwnerSignature' => 'required',
        'Files' => 'sometimes|array', // Modifica la regla para permitir arrays o nulo 
    ];

    protected $perPage = 20;

    /**
     * Attributes that should be mass-assignable.
     *
     * @var array
     */
    protected $fillable = ['AgentesId','LegalBusinessName','bda','LegalEntity','Other','TaxID','BusinessClass','Street','City','State','ZipCode','BusinessPhone','MonthlyDeposit','ProductsSold','Email','Years','Months','OwnerName','Ownertreet','OwnerCity','OwnerState','OwnerZipCode','OwnerHomePhone','OwnerCellPhone','OwnerTitle','OwnerOwnership','OwnerLicense','OwnerState2','OwnerDateBirth','OwnerSocial','isCoApplicant','Owner2Name','Owner2treet','Owner2City','Owner2State','Owner2ZipCode','Owner2HomePhone','Owner2CellPhone','Owner2Title','Owner2Ownership','Owner2License','Owner2State2','Owner2DateBirth','Owner2Social','DesiredAmount','UseFunds','CurrentCash','CompanyName','Balance','AppDate','CoApplicant','Files','OwnerSignature','Owner2Signature','Estado','ApproveAmout'];


    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'Files' => 'array',
    ];

In any case, the Files field does not save any data sent from the dropzone. whether validating the $rules or not.

This is what I have in my form

                 <!--begin::Dropzone-->
                <div class="dropzone" id="upload_files">
                    <!-- Message para Dropzone -->
                    <div class="dz-message needsclick">
                        <i class="fa-solid fa-cloud-arrow-up fs-5x text-primary"></i>

                        <!-- Info sobre la carga de archivos -->
                        <div class="ms-4">
                            <h3 class="fs-3 fw-bold text-gray-900 mb-1">Drop files here or click to upload.</h3>
                            <span class="fs-4 text-danger mb-1">Uploading the requested files is required.</span><br>
                            <span class="fs-4 text-danger">Copy of Driver’s License</span><br>
                            <span class="fs-4 text-danger">Copy of Business License</span><br>
                            <span class="fs-4 text-danger">Copy of Voided Check</span><br>
                            <span class="fs-4 text-danger">4 Last Bank Statement</span><br>
                            <span class="fs-4 fw-semibold text-gray-500">Upload up to 20 files</span>
                        </div>
                    </div>
                    <!-- Fin de Message -->
                </div>
                <!-- Fin de Dropzone -->

This is the javascript part

<script>
    Dropzone.autoDiscover = false;

    var myDropzone = new Dropzone("#upload_files", {
        url: "{{ route('aplicaciones.store') }}",
        paramName: "Files", // Ajusta el nombre del parámetro según tu controlador
        maxFiles: 20,
        maxFilesize: 20, // MB
        addRemoveLinks: true,
        uploadMultiple: true, // Permitir la carga de múltiples archivos
        acceptedFiles: "image/*,application/pdf,application/msword",
        headers: {
            'X-CSRF-TOKEN': "{{ csrf_token() }}"
        },
        success: function (file, response) {
            // Lógica después de que se carga el archivo, si es necesario
            $('form').append('<input type="hidden" name="Files[]" value="' + response.name + '">');
            console.log(response);
        },
        error: function (file, response) {
            // Lógica en caso de error, si es necesario
            console.log(response);
        },
        init: function () {
            @if(isset($project) && $project->document)
                var files = {!! json_encode($project->document) !!};
                for (var i in files) {
                    var file = files[i];
                    this.options.addedfile.call(this, file);
                    file.previewElement.classList.add('dz-complete');
                    $('form').append('<input type="hidden" name="Files[]" value="' + file.file_name + '">');
                }
            @endif
        }
    });
    </script>

I must clarify that everything works correctly except the dropzone

I hope I can find help with this.

Thank you...

0

There are 0 best solutions below