Summernote 未在 Bootstrap 模态上发布

Question

我在 Bootstrap 模态上使用 summernote 编辑器，POST 方法有问题。 Summernote 编辑器的内容未 posting。一切看起来都很好，但是当我尝试 post 时，我得到了这个输出 (print_r):

Array ( [title] => test title [category] => 3 [content] => [files] => )

你可以在下面找到我的HTML：

  <form action="myposturl.php" method="POST" >
    <div class="modal-body">
      <div class="form-group">
        <div class="row">
          <div class="col-sm-6">
            <label>Title</label>
            <input name="title" class="form-control" />
          </div>

          <div class="col-sm-6">
            <label>Category</label>
            <select class="form-control" name="category">
              <option value="">Please select</option>
              <option value="1">Design</option>
              <option value="2">Code</option>
              <option value="3">Something else</option>
            </select>
          </div>
        </div>
      </div>

      <div class="form-group">
        <div class="row">
          <div class="col-sm-12">
            <input class="summernote" name="content" />
          </div>

        </div>
      </div>
    </div>

    <div class="modal-footer">
      <button type="submit" class="btn btn-primary">Send</button>
    </div>
 </form>

提前致谢。

Answer 1

使用 div 或 summernote 的文本区域。像这样的最小实现：

http://summernote.org/getting-started/

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Summernote</title>
  <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
  <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script> 
  <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script> 
  <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.css" rel="stylesheet">
  <script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.js"></script>
</head>
<body>
  <div id="summernote"><p>Hello Summernote</p></div>
  <script>
    $(document).ready(function() {
        $('#summernote').summernote();
    });
  </script>
</body>
</html>

Answer 2

您可以使用文本区域或输入字段。只需要申请onchange listener.

<textarea class="summernote" name="content"></textarea>

如果它是文本区域：

$('.summernote').summernote({
    height: 300
}).on('summernote.change', function(we, contents, $editable) {
    $(this).html(contents);
});

如果它是一个输入字段：

$('.summernote').summernote({
    height: 300
}).on('summernote.change', function(we, contents, $editable) {
    $(this).val(contents);
});

Summernote 未在 Bootstrap 模态上发布

Summernote Not Posting on Bootstrap Modal

html

post

twitter-bootstrap

bootstrap-modal

summernote