FileUpload

TsgcHTMLComponent_FileUpload — renderuje strefę przesyłania plików metodą przeciągnij i upuść, która wysyła pliki jako multipart/form-data, w Delphi, C++ Builder i .NET.

TsgcHTMLComponent_FileUpload

Komponent przesyłania, który generuje element <form> Bootstrap ze stylizowaną strefą upuszczania, polem pliku i przyciskiem wysyłania, wraz z własnym dedykowanym CSS. Ustaw cel i limity, a następnie odczytaj właściwość HTML.

Klasa komponentu

TsgcHTMLComponent_FileUpload

Renderuje

Formularz Bootstrap 5 + dedykowany CSS strefy upuszczania

Języki

Delphi, C++ Builder, .NET

Utwórz go, ustaw cel, wyrenderuj

Ustaw Action, Accept i teksty strefy upuszczania, a następnie odczytaj HTML (albo umieść go na stronie TsgcHTMLTemplate_Bootstrap).

uses
  sgcHTML_Enums, sgcHTML_Component_FileUpload;

var
  oUpload: TsgcHTMLComponent_FileUpload;
begin
  oUpload := TsgcHTMLComponent_FileUpload.Create(nil);
  try
    oUpload.Action := '/api/upload';
    oUpload.Accept := 'image/*';
    oUpload.MaxSize := '5 MB';
    oUpload.Multiple := True;
    oUpload.DragDropEnabled := True;
    oUpload.ButtonText := 'Upload files';
    oUpload.ButtonStyle := bsPrimary;

    WebModule.Response := oUpload.HTML;   // <form> drop zone + scoped CSS
  finally
    oUpload.Free;
  end;
end;
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_FileUpload.hpp

TsgcHTMLComponent_FileUpload *oUpload = new TsgcHTMLComponent_FileUpload(NULL);
try
{
  oUpload->Action = "/api/upload";
  oUpload->Accept = "image/*";
  oUpload->MaxSize = "5 MB";
  oUpload->Multiple = true;
  oUpload->DragDropEnabled = true;
  oUpload->ButtonText = "Upload files";
  oUpload->ButtonStyle = bsPrimary;

  String html = oUpload->HTML;   // <form> drop zone + scoped CSS
}
__finally
{
  delete oUpload;
}
using esegece.sgcWebSockets;

var upload = new TsgcHTMLComponent_FileUpload();
upload.Action = "/api/upload";
upload.Accept = "image/*";
upload.MaxSize = "5 MB";
upload.Multiple = true;
upload.DragDropEnabled = true;
upload.ButtonText = "Upload files";
upload.ButtonStyle = TsgcHTMLButtonStyle.bsPrimary;

string html = upload.HTML;   // <form> drop zone + scoped CSS

Kluczowe właściwości i metody

Składniki, po które sięgasz najczęściej.

Cel

Action ustawia punkt końcowy POST; InputName nadaje nazwę polu pliku; formularz zawsze wysyła jako multipart/form-data.

Ograniczenia

Accept filtruje dozwolone typy plików; MaxSize wyświetla podpowiedź o limicie rozmiaru; Multiple pozwala użytkownikowi wybrać kilka plików naraz.

Strefa upuszczania

DragDropEnabled przełącza stylizowany obszar upuszczania; Title, Subtitle i ButtonText ustawiają jego tekst.

Wygląd

IconHTML ustawia ikonę strefy; ButtonStyle (TsgcHTMLButtonStyle, np. bsPrimary) nadaje styl przyciskowi wysyłania.

Wynik

HTML zwraca <form> przesyłania, a CSS zwraca dedykowane style .sgc-upload-zone — szablon strony generuje oba.

Układ

Dziedziczone Section, ColumnWidth i RowGroup umieszczają mechanizm przesyłania na siatce TsgcHTMLPageBuilder.

Poznawaj dalej

Wszystkie komponenty sgcHTMLPrzejrzyj pełną matrycę funkcji 60+ komponentów.
Pobierz bezpłatną wersję próbną30-dniowa wersja próbna zawiera projekty demonstracyjne 60.HTML.
CennikLicencje Single, Team i Site z pełnym kodem źródłowym.

Gotowy, aby zacząć?

Pobierz bezpłatną wersję próbną i dodaj przesyłanie metodą przeciągnij i upuść do swojej aplikacji webowej w Delphi, C++ Builder lub .NET.