Play FrameworkでTinyMCEを使う

@iwasaki 326views 更新:2014年8月2日

WYSIWYGエディタのTinyMCEをPlay Frameworkで使ってみましょう。

これもwebjarsから取ってくることが出来ます。

build.sbt

  "org.webjars" % "tinymce-jquery" % "4.0.16"

app/views/samples/tinymce.scala.html

@()
@import play.i18n._

@main(Messages.get("home.title")) {
<textarea>Your content here.</textarea>
}{

}{
        <script type='text/javascript' src='@routes.WebJarAssets.at(WebJarAssets.locate("tinymce.min.js"))'></script>
        <script type='text/javascript' src='@routes.WebJarAssets.at(WebJarAssets.locate("jquery.tinymce.min.js"))'></script>
        <script type='text/javascript' src="@routes.Assets.at("javascripts/tinymce.js")"></script>
}

public/javascripts/tinymce.js

$( document ).ready(function() {
    tinymce.init({
        selector: "textarea",
        plugins: [
            "advlist autolink lists link image charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste"
        ],
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
    });
    });

ちなみにセキュリティフィルタをかけてると動作しないので外しましょう。。。

https://github.com/YoshiteruIwasaki/sample-play-java-app/commit/f75b6cf5790dc557f70fad90f61eb1290ddc9be2

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません