如何将 Summernote 与 ASP.net C# Web 窗体一起使用-解网

问：

我已将 Summernote 包含在 ASP.NET Webforms 页面中，但是当我应用时，工具栏消失了。事实上，Summernote 只是显示为一个文本框。runat="server"

我正在使用，以便我可以在后面的代码中引用它来设置/获取内部文本。不确定这是正确的方法还是错误的方法？runat="server"

我已经包含了 js 和 css 链接/行......

<link href="https://cdn.jsdelivr.net/npm/summernote-lite.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/summernote-lite.min.js"></script>

母版页中包含以下 jquery/bootstrap 行...

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">

这是我为 Summernote 编写的 html 和 javascript......

    <p>
        <asp:Label ID="lblBody" runat="server" Text="Body" class="myLargeFont"></asp:Label>
        <textarea id="summernote" name="summernote" runat="server" style="width:650px; height:550px;"></textarea>
        <asp:ListBox ID="lstAttachments" runat="server" Visible="false" Height="200px" Width="150px"></asp:ListBox>
        <asp:Button ID="btnShowAttachment" runat="server" Text="Load" Visible="false" />
    </p>

    <script>
        $(document).ready(function () {
            $('#summernote').summernote({
                placeholder: 'Hello Bootstrap 4',
                //tabsize: 2,
                height: 300,
                toolbar: [
                    // [groupName, [list of button]]
                    ['fontname', ['fontname']],
                    ['fontsize', ['fontsize']],
                    ['style', ['bold', 'italic', 'underline', 'clear']],
                    ['font', ['strikethrough', 'superscript', 'subscript']],
                    ['color', ['color']],
                    ['para', ['ul', 'ol', 'paragraph']],
                    ['height', ['height']],
                    ['table', ['table']],
                    ['insert', ['link', 'picture', 'video']],
                    ['view', ['codeview']]
                ]
            });
        });
    </script>

在以下屏幕截图中，链接是设置 runat=“server” 时的结果，如果没有 runat=“server”...

没有 runat=server 结果

使用 runat=server 结果

C# asp.net WebForms SummerNote

根据您正在运行的 WebForms 版本有多古老，当您添加到元素或 WebControl 时，它将覆盖破坏脚本的属性 - 您可以在 ASP.NET 4 中轻松覆盖它，请参阅此处： learn.microsoft.com/en-us/dotnet/api/... - 但一个更好的主意是远离一个自 2008 年 MVC 问世以来已经有效过时 ASP.NET 死平台 - 那是 15 年前......runat="server"id=""ClientIdMode=""

0赞 sconners 10/30/2023

我们使用的是 ASP.Net 4.8。那么我们应该使用 ClientIdMode=“” 而不是 id=“” 吗？

0赞 sconners 10/30/2023

@Dai - 感谢 ClientIdMode=“” 提示，它似乎有效。我已将其设置为 ClientIdMode=“Static” 以保留原始 ID。但是，我还有另一个问题，可能需要提交另一个问题。但是谢谢！

答： 暂无答案

上一个：如何从 ASP.Net Webforms 代码隐藏中设置 Summernote 文本

下一个：如何使用 tailwindcss 将 summernote 嵌入到 asp.net 项目中

如何将 Summernote 与 ASP.net C# Web 窗体一起使用

How to use Summernote with ASP.net C# webforms

评论