2024年4月20日 星期六

[研究]ASP.NET,WebForm,試用Froala 4.2.0 WYSIWYG HTML editor 套件

[研究]ASP.NET,WebForm,試用Froala 4.2.0 WYSIWYG HTML editor 套件

2024-04-20

環境:Visual Studio 2022 + ASP.NET + WebForm + Web Application + C# + SQL Server 2019 + SQL Server Management Studio (SSMS) 19

官方網站:https://froala.com/wysiwyg-editor/

Pricing (價格):https://cart.froala.com/。Free Trial 只提供 自架服務 (Self-Hosted)

範例:https://froala.com/wysiwyg-editor/docs/overview/

https://froala.com/wysiwyg-editor/examples/

********************************************************************************

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/4.2.0/css/froala_editor.pkgd.min.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <textarea id="editor" runat="server"></textarea><br />
            <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
        </div>
    </form>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/4.2.0/js/froala_editor.pkgd.min.js"></script>
    <script> 
        var editor = new FroalaEditor('#editor');
    </script>
</body>
</html>


Default.aspx.cs

using System;

namespace WebApplication1
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }
        protected void btnSubmit_Click(object sender, EventArgs e)
        {
            string quillContent = Request.Form["editor"];
            Response.Write("<script>alert('" + quillContent + "')</script>");
        }
    }
}






********************************************************************************
Froala 4.2.0 WYSIWYG HTML editor 可免費使用 ? 可免費商用使用 ?

ChatGPT

Froala Editor 4.2.0是一款商業產品,提供了免費版本和付費版本。 免費版本包含了基本功能,而付費版本則提供了更多高級功能和技術支援。

根據Froala的官方授權協議,免費版本主要適用於個人專案、非商業專案以及非營利組織。 如果你的專案是商業用途或是為獲利目的,那麼你可能需要購買Froala Editor的許可證。 商業許可證的價格取決於你的專案規模和需要的功能。

在任何情況下,建議在使用Froala Editor之前查看其最新的許可協議,以確保你的使用符合其規定。 你可以在Froala的官方網站上找到最新的授權資訊和購買選項。

********************************************************************************
下圖,NuGet安裝版

下圖,F5執行index.html會出錯





嚴重性 程式碼 說明 專案 檔案 隱藏項目狀態
錯誤 Build:索引簽章參數類型必須為 'string' 或 'number'。 WebApplication2 C:\CodeTemp\WebApplication2\WebApplication2\Scripts\froala-editor\index.d.ts 1534
錯誤 Build:索引簽章參數類型必須為 'string' 或 'number'。 WebApplication2 C:\CodeTemp\WebApplication2\WebApplication2\Scripts\froala-editor\index.d.ts 1535
警告 元素 'html' 需要有結束標記。 WebApplication2 C:\CodeTemp\WebApplication2\WebApplication2\Scripts\froala-editor\index.html 2


NuGet的 Froala 4.2.0 安裝版有問題,無法使用。

********************************************************************************

(完)

相關

沒有留言:

張貼留言