socialforge/app/views/forums/show.html.erb

<%= content_for(:header_tags) do %>
    <%= import_ke(enable_at: false, prettify: false, init_activity: false) %>
    <%= javascript_include_tag 'new_user' %>
<% end %>


<div class="postRightContainer">
  <div id="create_memo_div" style="display: none">
    <div id="error" class="red fl mb10" style="display: none">error</div>
    <%= labelled_form_for(@memo, :url => forum_memos_path(@forum),:remote=>true) do |f|  %>
    <div>
      <textarea type="text" name="memo[subject]" id="memo_subject" maxlength="50" onblur="check_memo_name();" onfocus="$('#error').hide();" onmouseover="this.style.borderColor='#d9d9d9'" class="postDetailInput" placeholder="输入帖子标题"  ></textarea>
      <script>
          var textarea1 = document.getElementById('memo_subject');
          autoTextarea(textarea1);
      </script>
    </div>
    <div class="mt15">
      <%= kindeditor_tag 'memo[content]','',:height=>300,:editor_id=>'memo_content'%>
    </div>
    <div class="mt10">
      <!--<a href="javascript:void(0);" class="AnnexBtn fl mt3">上传附件</a>-->
      <%= render :partial => 'file_form', :locals => {:container => @memo} %>
      <div class="fr">
        <a href="javascript:void(0);" class="submit_btn" onclick="check_and_submit();">确定</a>
      </div>
      <div class="fr"><a href="javascript:void(0);" class="linkGrey2 mr10" onclick="create_cancle();">取消</a><span class="mr10 fontGrey">或</span></div>
      <div class="cl"></div>
    </div>
    <% end %>
  </div>
  <div class="postDetailBanner">
    <div class="postSort" id="time"><a href="javascript:void(0);" class="linkGrey2 fl">时间</a><a href="javascript:void(0);" id="reorder_time" class="sortArrowActiveD"></a></div>
    <div class="postSort" id="popu"><a href="javascript:void(0);" class="linkGrey2 fl">人气</a><a href="javascript:void(0);"  id="reorder_popu" class=""></a></div>

    <div class="postSort" id="complex"><a href="javascript:void(0);" class="linkGrey2 fl">综合</a><a href="javascript:void(0);" id="reorder_complex" class=""></a><!--<a href="javascript:void(0);" class="sortArrowActiveD"></a>--></div>

    <div class="creatPost" id="create_memo_btn"><a href="javascript:void(0);" class="c_white db creatPostIcon bBlue" onclick="$('#error').hide();$('#create_memo_div').slideToggle();$(this).parent().slideToggle();">发布新帖</a></div>
    <div class="cl"></div>
  </div>
  <div id="topics_list">
    <%= render :partial => 'show_topics',:locals => {:memos=>@memos}%>
  </div>

  <!--<div class="pageRoll">-->
    <!--<div class="pageCell"><a href="javascript:void(0);" class="linkBlue">上一页</a></div>-->
    <!--<div class="pageCell pageCellActive"><a href="javascript:void(0);" class="c_white">1</a></div>-->
    <!--<div class="pageCell"><a href="javascript:void(0);" class="fontBlue">2</a></div>-->
    <!--<div class="pageCell"><a href="javascript:void(0);" class="fontBlue">3</a></div>-->
    <!--<div class="pageCell"><a href="javascript:void(0);" class="fontBlue">...</a></div>-->
    <!--<div class="pageCell"><a href="javascript:void(0);" class="fontBlue">14</a></div>-->
    <!--<div class="pageCell"><a href="javascript:void(0);" class="linkBlue">下一页</a></div>-->
  <!--</div>-->
  <!--<div class="cl"></div>-->
</div>
</div>
<script>
    function add_class(id){
        if($("#"+id).hasClass("sortArrowActiveD")){
            $("#"+id).removeClass("sortArrowActiveD");
            $("#"+id).addClass("sortArrowActiveU");
            $.ajax({
                type: 'GET',
                url: '<%= forums_path+"/"+@forum.id.to_s %>' + '.js?' + id + '=asc&page='+<%= @topic_pages.page%>

            });
        }else if($("#"+id).hasClass("sortArrowActiveU")){
            $("#"+id).removeClass("sortArrowActiveU");
            $("#"+id).addClass("sortArrowActiveD");
            $.ajax({
                type: 'GET',
                url: '<%= forums_path+"/"+@forum.id.to_s %>' + '.js?' + id + '=desc&page='+<%= @topic_pages.page%>

            });
        }else{
            $("#"+id).addClass("sortArrowActiveD");
            $.ajax({
                type: 'GET',
                url: '<%= forums_path+"/"+@forum.id.to_s %>' + '.js?' + id + '=desc&page='+<%= @topic_pages.page%>

            });
        }
    }
    $(function() {
        $("#complex").click(function(){
            $("#reorder_popu").removeClass("sortArrowActiveU");
            $("#reorder_popu").removeClass("sortArrowActiveD");
            $("#reorder_time").removeClass("sortArrowActiveD");
            $("#reorder_time").removeClass("sortArrowActiveU");
            add_class("reorder_complex");
        });
        $("#popu").click(function () {
            $("#reorder_complex").removeClass("sortArrowActiveD");
            $("#reorder_complex").removeClass("sortArrowActiveU");
            $("#reorder_time").removeClass("sortArrowActiveD");
            $("#reorder_time").removeClass("sortArrowActiveU");
            add_class("reorder_popu");
        });
        $("#time").click(function () {
            $("#reorder_complex").removeClass("sortArrowActiveD");
            $("#reorder_complex").removeClass("sortArrowActiveU");
            $("#reorder_popu").removeClass("sortArrowActiveU");
            $("#reorder_popu").removeClass("sortArrowActiveD");
            add_class("reorder_time");
        });
        <% if @errors %>
        $('#create_memo_div').slideToggle();$('#create_memo_btn').slideToggle();
        $("#error").html('<%= @errors.html_safe %>').show();
        <% end %>
    });

    var first_click = true;
    function check_and_submit(){
        if(!check_memo_name()){
            return;
        }
        if($("textarea[name='memo[subject]']").val().trim() != "" && !memo_content.isEmpty() && first_click){
            first_click = false;
            memo_content.sync();
            $.ajax({
                url:'/forums/'+'<%= @forum.id.to_s%>'+'/memos',
                type:'post',
                data:$("#new_memo").serialize(),
                success:function(data){

                },
                error:function(){
                    alert('请检查当前网络连接')
                }
            });
            //$("#new_memo").submit();
        }else if($("textarea[name='memo[subject]']").val().trim() == "" && memo_content.isEmpty()){
            $("#error").html("主题和内容不能为空").show();
        }
        else if($("textarea[name='memo[subject]']").val().trim() == "" && !memo_content.isEmpty() ){
            $("#error").html("主题不能为空").show();
        }else if($("textarea[name='memo[subject]']").val().trim() != "" && memo_content.isEmpty()){
            $("#error").html("内容不能为空").show();
        }
    }

    function check_memo_name(){
        if($("#memo_subject").val().trim().length > 50){
            $("#error").html("主题 过长（最长为 50 个字符）").show();
            return false;
        }
        if(memo_content.html().length > 20000){
            $("#error").html("内容 过长（最长为 20000 个字符）").show();
            $("html,body").animate({scrollTop:$("#error").offset().top},1000)
            return false;
        }
        return true;
    }

    function create_cancle(){
        $('#create_memo_div').slideToggle();
        $('#create_memo_btn').slideToggle();
        $('#memo_subject').val('');
        memo_content.html('')
        $('#error').html('').hide();
    }
</script>