FodAttachments

A document upload component for managing file attachments with requirements validation. Supports multiple document types, file size limits, format restrictions, and preview functionality.

Basic Usage

Upload documents with defined requirements. Required documents must be uploaded before form submission.

ID Card / Passport (obligatoriu)

Upload a clear copy of your ID card or passport

Se va atașa documentul în format PDF, JPG, JPEG, PNG și mărimea maximă până la 5 MB

Proof of Address (obligatoriu)

Utility bill or bank statement from the last 3 months

Se va atașa documentul în format PDF, JPG, JPEG, PNG și mărimea maximă până la 5 MB

razor
<FodAttachments
    Documents="@_documents"
    OnDocumentUploaded="@HandleDocumentUploaded"
    OnDocumentRemoved="@HandleDocumentRemoved"
    MaxConcurrentUploads="2"
    ShowPreview="true" />

@code {
    private List<DocumentRequirement> _documents =
    [
        new DocumentRequirement
        {
            Id = "id-card",
            Name = "ID Card / Passport",
            Description = "Upload a clear copy of your ID",
            IsRequired = true,
            AcceptedFormats = ".pdf,.jpg,.jpeg,.png",
            MaxFileSize = 5 * 1024 * 1024
        }
    ];

    private void HandleDocumentUploaded(DocumentUploadedEventArgs args)
    {
        Console.WriteLine($"Uploaded: {args.FileName}");
    }
}

Required vs Optional Documents

Documents can be marked as required or optional. Required documents show a validation indicator.

Passport Photo (obligatoriu)

Recent passport-style photograph

Se va atașa documentul în format JPG, JPEG, PNG și mărimea maximă până la 2 MB

CV / Resume(opțional)

Your curriculum vitae (optional)

Se va atașa documentul în format PDF, DOC, DOCX și mărimea maximă până la 10 MB

Cover Letter(opțional)

Optional cover letter

Se va atașa documentul în format PDF, DOC, DOCX și mărimea maximă până la 5 MB

razor
private List<DocumentRequirement> _documents =
[
    new DocumentRequirement
    {
        Id = "passport-photo",
        Name = "Passport Photo",
        IsRequired = true,  // Required - must be uploaded
        AcceptedFormats = ".jpg,.jpeg,.png"
    },
    new DocumentRequirement
    {
        Id = "cv-resume",
        Name = "CV / Resume",
        IsRequired = false,  // Optional - can be skipped
        AcceptedFormats = ".pdf,.doc,.docx"
    }
];

File Format Restrictions

Restrict accepted file formats per document type. Users can only upload files matching the specified extensions.

Photo (Images Only) (obligatoriu)

Only JPG, JPEG, PNG allowed

Se va atașa documentul în format JPG, JPEG, PNG și mărimea maximă până la 5 MB

Document (PDF Only) (obligatoriu)

Only PDF files allowed

Se va atașa documentul în format PDF și mărimea maximă până la 10 MB

razor
new DocumentRequirement
{
    Id = "photo-only",
    Name = "Photo (Images Only)",
    AcceptedFormats = ".jpg,.jpeg,.png",  // Only images
    MaxFileSize = 5 * 1024 * 1024  // 5 MB limit
},
new DocumentRequirement
{
    Id = "pdf-only",
    Name = "Document (PDF Only)",
    AcceptedFormats = ".pdf",  // Only PDF
    MaxFileSize = 10 * 1024 * 1024  // 10 MB limit
}

API Reference

Properties available on the FodAttachments component.

No properties defined.

DocumentRequirement Model

Configuration options for document requirements.

No properties defined.

Rejoining the server...

Rejoin failed... trying again in seconds.

Failed to rejoin.
Please retry or reload the page.

Retry

The session has been paused by the server.

Resume

Failed to resume the session.
Please reload the page.