socialforge/app/views/statistics/_form.html.erb

<%= stylesheet_link_tag '/editormd/css/editormd','/editormd/css/editormd.min.css' %>
<%= javascript_include_tag '/editormd/lib/marked.min.js','/editormd/lib/prettify.min.js','/editormd/lib/raphael.min.js','/editormd/lib/underscore.min.js','/editormd/lib/sequence-diagram.min.js',
                           '/editormd/lib/flowchart.min.js','/editormd/lib/jquery.flowchart.min.js','/editormd/editormd.js' %>
<div id="create_new_statis" class="bg_white_bor pl10 pt20 pr10 cl mb20">
  <%= form_for(@statistic) do |f| %>
      <% if @statistic.errors.any? %>
          <div id="error_explanation">
            <h2><%= pluralize(@statistic.errors.count, "error") %> prohibited this statistic from being saved:</h2>
            <ul>
              <% @statistic.errors.full_messages.each do |msg| %>
                  <li><%= msg %></li>
              <% end %>
            </ul>
          </div>
      <% end %>

      <div class="field line_field">
        <label><span>*</span>数据名称：</label>
        <%= f.text_field :name, :class => "wb85" %>
        <p class="cl" style="padding-left: 10%;color: red;height: 20px"><span id="input_name_notice" class="none">请输入数据名称</span></p>
      </div>
      <div class="field line_field mb50">
        <label><span>*</span>数据分类：</label>
        <%= f.select :main_category_id, (@main_categories.collect { |mc| [mc.name, mc.id] }),
                     {:no_label => true}, :onchange => 'getSubCategory(this.options[this.options.selectedIndex].value)',
                     :class => "w150" %>

        <div class="fl pr wb20 ml20 change_sort" id="sub_category" style="display: <%= @sub_categories.blank? ? 'none' : '' %>">
          <%= f.select :sub_category_id, (@sub_categories.present? ? @sub_categories.collect { |mc| [mc.name, mc.id] } : []),
                       {:no_label => true}, :class => "w150" %>
        </div>
      </div>
      <div class="field line_field">
        <label>数据描述：</label>
        <div id="statistics_description" class="new_li fl">
          <%= f.text_area :description, :class => "wb85 h200 mb20", :style => "display: none;" %>
        </div>
      </div>
      <div class="field cl">
        <label>&nbsp;</label>
        <div class="fl">
            <%= render :partial => 'attachments/form_statistic', :locals => {:container => @statistic, :isReply => @isReply} %>
        </div>
      </div>
      <div class="actions cl mb20">
        <a href="javascript:void(0)" class="blue_btn_big c_white fr mr45" onclick="submit_cate();">保存</a>
        <%= link_to '取消', statistics_path ,:class=>"grey_btn_big fr c_white mr10" %>
      </div>
  <% end %>
</div>

<script>
    taskpass_editormd =  editormd("statistics_description", {
        width   : "85.5%",
        height  : 400,
        syncScrolling : "single",
        //你的lib目录的路径，我这边用JSP做测试的
        path    : "/editormd/lib/",
        tex              : true,
        tocm             : true,
        emoji            : true,
        taskList         : true,
        codeFold         : true,
        searchReplace    : true,
        htmlDecode       : "style,script,iframe",
        flowChart        : true,
        sequenceDiagram  : true,
        autoFocus: false,
        toolbarIcons : function() {
            // Or return editormd.toolbarModes[name]; // full, simple, mini
            // Using "||" set icons align right.
            return ["bold", "italic", "|", "list-ul", "list-ol", "|", "code", "code-block", "|", "testIcon", "testIcon1", '|', "image", "table", '|', "watch", "clear" ]
        },
        toolbarCustomIcons : {
            testIcon  : "<a type=\"inline\" class=\"latex\" ><div class='zbg'></div></a>",
            testIcon1 : "<a type=\"latex\" class=\"latex\" ><div class='zbg_latex'></div></a>"
        },
        //这个配置在simple.html中并没有，但是为了能够提交表单，使用这个配置可以让构造出来的HTML代码直接在第二个隐藏的textarea域中，方便post提交表单。
        saveHTMLToTextarea : true,
        // 用于增加自定义工具栏的功能，可以直接插入HTML标签，不使用默认的元素创建图标
        dialogMaskOpacity : 0.6,
        placeholder: "<%= @st == 0 ? "请输入完成当前任务依赖的知识点或者其它相关信息" : "请输入选择题的题干内容" %>",
        imageUpload : true,
        imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp", "JPG", "JPEG", "GIF", "PNG", "BMP", "WEBP"],
        imageUploadURL : "<%#= upload_with_markdown_path(:container_id => @shixun.id, :container_type => @shixun.class) %>",//url
        onload: function(){
            $("#statistics_description [type=\"latex\"]").bind("click", function(){
                taskpass_editormd.cm.replaceSelection("```latex");
                taskpass_editormd.cm.replaceSelection("\n");
                taskpass_editormd.cm.replaceSelection("\n");
                taskpass_editormd.cm.replaceSelection("```");
                var __Cursor = taskpass_editormd.cm.getDoc().getCursor();
                taskpass_editormd.cm.setCursor(__Cursor.line-1, 0);
            });

            $("#statistics_description [type=\"inline\"]").bind("click", function(){
                taskpass_editormd.cm.replaceSelection("$$$$");
                var __Cursor = taskpass_editormd.cm.getDoc().getCursor();
                taskpass_editormd.cm.setCursor(__Cursor.line, __Cursor.ch-2);
                taskpass_editormd.cm.focus();
            });
            $("[type=\"inline\"]").attr("title", "行内公式");
            $("[type=\"latex\"]").attr("title", "多行公式");
        }
    });

    function submit_cate(){
        var name=$("#statistic_name").val();
        var cate=$("#statistic_main_category_id option:selected").text();
        if(name == ""){
            $("#input_name_notice").removeClass("none");
            return;
        }
        $("#new_statistic").submit();
        $("#edit_statistic_<%= @statistic.id %>").submit();
    }
    //  获取子类别
    function getSubCategory(id){
        $.ajax({
            url: '<%= get_sub_category_statistics_path %>',
            type: 'get',
            data: {main_category_id: id}
        });
    }
    //删除标签
    function tag_del(item){
        $(item).parents(".tag_span").remove();
    }
    function save_tag(){
        var value=$("#input_tag").val();
        var html="";
        if(value != ""){
            html='<span class="tag_span">'+value+'<input type="hidden" value="'+value+'" class="tag_hide"><a class="tag_del ml3" onclick="tag_del(this)">×</a></span>';
        }
        $("#input_tag").val('');
        $("#tag_modal").append(html);
        $("#save_tag_all").addClass("none");
    }
    function show_inputContent(){
        $("#save_tag_all").removeClass("none");
    }

    $(function(){
        $(".c_sort_input").live("focus",function(){
            $(".c_sort_list").hide();
            $(this).siblings(".c_sort_list").show();
        })
        $(".c_sort_list li").live("click",function(){
            var p=$(this).parent(".c_sort_list");
            var value=$(this).html().trim();
            $(p).siblings(".c_sort_input").val(value);
            $(".c_sort_list").hide();
        })
        $("body").live("click",function(e){
            var idv=$(e.target).attr("id");
            if(idv !="parent_down" && idv != "child_down"){
                $(".c_sort_list").hide();
            }
        })
    })
</script>