bootstrap wysiwyg:如何获取服务器端的格式化文本?

时间:2013-07-25 04:28:17

标签: twitter-bootstrap wysiwyg

我正在学习Bootstrap,并希望有一个所见即所得的编辑器。我找到 bootstrap-wysiwyg 并希望使用它。

http://mindmup.github.io/bootstrap-wysiwyg/

但是,在提交表单时,我无法弄清楚如何在服务器端获取格式化文本。

5 个答案:

答案 0 :(得分:7)

我发现了如何做到这一点。这是如何。

需要隐藏的输入或textarea字段。此字段可以将name属性设置为对象字段的名称。它的名字必须是服务器端期望的东西。

使用JQuery将表单提交事件处理程序附加到包含wysiwyg编辑器的表单。处理程序从wysiwyg编辑器获取文本并将其设置为隐藏字段的值。

希望这有助于其他人。

答案 1 :(得分:6)

<textarea class="textarea" name="mytext" placeholder="Enter text ..." style="width: 810px; height: 200px"></textarea>

使用val()

$('.textarea').wysihtml5();

$('.textarea').val();

http://jsfiddle.net/suhailvs/vNPAJ/3/

你可以把它作为帖子

request.POST['mytext'] 

答案 2 :(得分:2)

这是一个老线程,但也许这个提示会帮助其他人。

正如courious1所提到的,我们需要在表单上创建一个隐藏的textarea(例如:id = hidden-editor)。 并使用下面的javascript将#editor中的值传递给我们的#infidden-editor:

//-- submit button clicked
$('#submit-btn').click(function(){
    $('#hidden-editor').html(
        $("#editor").html()
    );
});

答案 3 :(得分:1)

我终于想出了这个解决方案。没有设法使onclick工作...但实时修改是方便的。谢谢你的想法。

$('#editor').bind("DOMSubtreeModified",function(){
                $('#you_hidden_textarea').html(
                        $("#editor").html()
                );
            });

答案 4 :(得分:0)

以下是如何获取 bootstrap-wysiwyg

的编辑内容

在此处将id设置为以下div我已将编辑器用作id并且我还设置了一个保存按钮。

<div id="editor">
      Go ahead&hellip;
    </div>

<a class="btn" data-edit="bold" id="saveBtn" title="Save"><i class="icon-save"></i></a>

然后

$('#editor').wysiwyg();

$('#saveBtn').on('click',function(){        

       console.log($('#editor').html());

      })

希望这将有助于其他人