Question

我在Bootstrap模式上使用summernote编辑器，POST方法存在问题。 Summernote编辑的内容未发布。一切看起来都不错，但是当我尝试发布时，我得到了这个输出（print_r）：

数组（[title] =＆gt;测试标题[category] =＆gt; 3 [content] =＆gt; [files] =＆gt;）

您可以在下方找到我的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或textarea作为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

您可以使用textarea或输入字段。只需要应用onchange监听器。

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

如果是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);
});

Summer Note不在Bootstrap模态上发布

2 个答案: