2017-11-23 9 views
0

이것은 이상한 문제이며, 온라인 조사를 거친 후 나는 그것을 해결할만한 것을 본 적이 없다고 생각합니다.thymeleaf 양식 텍스트 영역에 나타나는 tinymce 인터페이스를 얻는 방법은 무엇입니까?

나는 thymeleaf에 양식이 있습니다. 또한 페이지에 tinyMCE 플러그인이 설치되어 있습니다. 누구든지 양식에 대한 입력으로 tinymce 플러그인을 표시하는 방법을 알고 있습니까? 당신이 볼 수 있듯이

<head> 
 
     <title>Nobody Can Solve This.</title> 
 
     <script> 
 
    tinymce.init({ 
 
    selector: "textarea" 
 
    }); 
 
    </script> 
 

 
</head> 
 
\t 
 
\t <body> 
 

 
\t \t <center><h2>Submitting a post(via Tiny MCE)</h2></center> 
 

 
\t \t <form method="post"> 
 
    <textarea id="mytextarea">Hello, World!</textarea> 
 
    </form> 
 
\t 
 
\t \t \t 
 
\t \t <h1>Form</h1> 
 
    <form action="#" th:action="@{/blogposts/addBlogPost}" th:object="${blogPost}" method="post"> 
 
     <p>Title: <input type="text" th:field="*{title}" /></p> 
 
     <p>Author: <input type="text" th:field="*{authors}" /></p> 
 
     <p>Content: <input type="textarea" th:field="*{content}" /></p> 
 
     <p><textarea name="ephox">Blog Post</textarea></p> 
 
     <p>Subject: <input type="text" th:field="*{Subject}" /></p> 
 
     <p><input type="submit" value="Submit" /> <input type="reset" value="Reset" /></p> 
 
    </form> 
 
\t

, 나는 페이지에, 심지어 형태에서 나타나는 TinyMCE에 플러그인을 얻을 수 있지만, 나는 실제로 내용을 제출하는 데 사용할 수 없습니다.

아이디어가 있으십니까? 나는 모든 것을 시도했다.

답변

0

이 있어야합니다 잊지 마세요하지만 스택 오버플로가있다 매우 Thymeleaf에 관해서는 실망 스럽습니다. 사람들은 보통 내 질문에 전혀 답하지 않는 기본 문서로 안내하고 읽지 않는다고 가정합니다. 나는이 질문에 대해서만 이야기하는 것이 아니라, 답변을 쓸모 없거나 적대적으로 여겼기 때문에 몇 달 뒤에 게시하고 결국 삭제 한 질문들에 대해 이야기하고 있습니다. 나는 과거에했던 것보다 내 문제를 설명하는 더 유익하고 설명적인 방법을 생각할 수 없다. 이 질문과는 달리, 나는 일반적으로 내가 시도한 모든 것과 내가 사용한 자원을 설명하고, 똑같은 대우를 받는다. Thymeleaf는 새로운 슈퍼입니까? 왜 아무도 그것에 대해 안다?

어쨌든,이 문제를 해결하는 방법은 당신의 입력 텍스트 영역 아래 형태 내에서 아직 여전히 내용 입력 :

<p>Content: <input type="hidden" th:field="*{content}" /></p> 
 
<textarea name="object" id="object" th:field="*{content}">
일단 제대로 TinyMCE에 의지 통합을 .html 문서 내의 텍스트 영역을 식별하고 플러그인을 적용하십시오. 그러나 양식 내에서 'input type = "textarea"'를 사용하면 그렇게하지 않습니다. 따라서 기본적으로 입력 구성 요소 아래에 다른 텍스트 영역을 만들고 ID 및 필드를 객체 내의 적절한 객체/요소 (이 경우 블로그 게시물의 내용)로 정의하는 것이 기본적으로 끝납니다. 그런 다음 다른 텍스트 입력을 숨기거나 객체 내의 동일한 요소에 대한 두 개의 텍스트 상자를 남겨 두어야합니다.

1

멋진 예제를 here에서 가져옵니다. 내 예제에는 외부 스크립트가 포함 된 API 키을 붙여 넣을 수 없기 때문에 오류가 발생합니다.

은 JS 외부 라이브러리 내가 여기 무례 나서야 시도하고 있지 않다 형식

https://cloud.tinymce.com/dev/tinymce.min.js?apiKey=qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc

tinymce.init({ 
 
    selector: 'textarea', 
 
    height: 500, 
 
    theme: 'modern', 
 
    plugins: 'print preview fullpage powerpaste searchreplace autolink directionality advcode visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount tinymcespellchecker a11ychecker imagetools mediaembed linkchecker contextmenu colorpicker textpattern help', 
 
    toolbar1: 'formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify | numlist bullist outdent indent | removeformat', 
 
    image_advtab: true, 
 
    templates: [ 
 
    { title: 'Test template 1', content: 'Test 1' }, 
 
    { title: 'Test template 2', content: 'Test 2' } 
 
    ], 
 
    content_css: [ 
 
    '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i', 
 
    '//www.tinymce.com/css/codepen.min.css' 
 
    ] 
 
});
body { 
 
    padding:5px 
 
}
<script src="https://cloud.tinymce.com/dev/tinymce.min.js"></script> 
 

 
<textarea></textarea>

+0

이것은 thymeleaf가 아닙니다. 왜이 바보 같은 웹 사이트에서 아무도 내가 읽지 않은 것을 읽지 않습니다. 이것은 HTML의 Javascript입니다. ** 이것은 ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** ** – DaveCat