FileUpload

TsgcHTMLComponent_FileUpload — 渲染一个拖放式文件上传区域,以 multipart/form-data 形式提交文件,适用于 Delphi、C++ Builder 和 .NET。

TsgcHTMLComponent_FileUpload

一个上传组件,发出带有样式化拖放区、文件输入框和提交按钮的 Bootstrap <form>,外加其自身的作用域 CSS。设置操作和限制,然后读取 HTML 属性。

组件类

TsgcHTMLComponent_FileUpload

渲染为

Bootstrap 5 表单 + 作用域拖放区 CSS

语言

Delphi, C++ Builder, .NET

创建它、设置目标、渲染它

设置 ActionAccept 和拖放区文本,然后读取 HTML(或将其放入 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

关键属性与方法

您最常使用的成员。

目标

Action 设置 POST 端点;InputName 为文件字段命名;该表单始终以 multipart/form-data 形式提交。

约束

Accept 过滤允许的文件类型;MaxSize 显示大小限制提示;Multiple 让用户一次选择多个文件。

拖放区

DragDropEnabled 切换样式化拖放区域;TitleSubtitleButtonText 设置其文案。

外观

IconHTML 设置区域图标;ButtonStyleTsgcHTMLButtonStyle,如 bsPrimary)为提交按钮设置样式。

输出

HTML 返回上传 <form>CSS 返回作用域 .sgc-upload-zone 样式 — 页面模板会同时发出两者。

布局

继承的 SectionColumnWidthRowGroup 将上传器放置在 TsgcHTMLPageBuilder 网格上。

继续探索

所有 sgcHTML 组件浏览 60 多个组件的完整功能矩阵。
下载免费试用版30 天试用版附带 60.HTML 演示项目。
价格Single、Team 和 Site 授权,均含完整源代码。

准备好开始了吗?

下载免费试用版,为您的 Delphi、C++ Builder 或 .NET Web 应用添加拖放上传功能。