ACE编辑器:textarea始终将空值传递给表单

时间:2018-08-18 07:04:41

标签: javascript html ace-editor

我正在使用Flask进行Web开发。我通过以下方式将ACE编辑器集成到表单中:

<textarea  maxlength="10000" rows="20" cols="80" name="tc001_input" form="usrform" data-editor="markdown" id="editor">{{input}}</textarea>
<form action="/tc001" id="usrform" method = "post">
  <input type="submit">

  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.3/ace.js"></script>
<script type="text/javascript">
    // https://gist.github.com/duncansmart/5267653
    // find each text area marked to have an editor
    $('textarea[data-editor]').each(function() {
        var textarea = $(this);
        var mode = textarea.data('editor');
        // create the editor div
        var div = $('<div>', {
            'width': textarea.outerWidth(),
            'height': textarea.outerHeight(),
            'class': textarea.attr('class')
        }).insertBefore(textarea);
        // hide the original text area
        textarea.hide();
        // configure the editor
        var editor = ace.edit(div[0]);
        var session = editor.getSession();
        editor.setTheme("ace/theme/github");
        session.setValue(textarea.val());
        session.setMode('ace/mode/' + mode);
        session.setNewLineMode('unix');
        session.setTabSize(4);
        session.setUseSoftTabs(true);
        session.setUseWrapMode(true);
        // update the text area before submitting the form
        textarea.closest('form').submit(function() {
            textarea.val(editor.getSession().getValue());
        });
    });
</script>
</form>

它可以正确显示,但是只要我提交并读取属性,就可以:

request.form['tc001_input']

然后我得到“空白”数据。提交之前,我已将数据“ abc”输入到textarea中。怎么了?

1 个答案:

答案 0 :(得分:0)

问题在于您的文本区域不在表单内,因此highlight(row){ this.selectedRowIndex=row.position; } 不起作用,这是使用最新ace的修改版本,并且文本区域的.form属性有效

textarea.closest('form')