orbit-basic/app/views/desktop/journal_pages/_form.html.erb

<div class="toolbar hh2">
  <div class="fn_g hp">
    <%= f.submit "Save", name: "commit", value: "Save", class: "fn_btn ini_input hp hh2 thmc2 thmtxt" %>
    <!-- class: bt-cancle can't be remove -->
    <% if not @writing_journal.new_record? %>
      <%= submit_tag "Cancel", :type => "button", class: "bt-cancel ini_input hp hh2 thmadm thmtxt" %>
    <% end %>
  </div>
  <!--<div class="hh2 hp sdm">
    <div class="sdm_t hh2">Entry Year</div>
    <div class="admbg sdm_o">
      <ul>
        <li><a class="hp hh2 admtxt" href="">2012</a></li>
      </ul>
    </div>
  </div>
  <div class="hh2 hp sdm">
    <div class="sdm_t hh2">Language</div>
    <div class="admbg sdm_o">
      <ul>
        <li><a class="hp hh2 admtxt" href="">English</a></li>
        <li><a class="hp hh2 admtxt" href="">Chinese</a></li>
      </ul>
    </div>
  </div>-->
  <div class="hh2 hp sdm">
    <div class="sdm_t hh2">Share</div>
    <div class="admbg sdm_o">
      <ul>
        <li><a class="hp hh2 admtxt" href="">Full</a></li>
        <li><a class="hp hh2 admtxt" href="">Abstract</a></li>
        <li><a class="hp hh2 admtxt" href="">Friends</a></li>
        <li><a class="hp hh2 admtxt" href="">Private</a></li>
        <li><a class="hp hh2 admtxt" href="">Group</a></li>
      </ul>
    </div>
  </div>
  <div class="hh2 hp sdm">
    <div class="sdm_t hh2"><span class="icon-question-sign"></span></div>
  </div>
</div>
<div id="paper_add" class="tinycanvas vp">
  <div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
  <div class="viewport">
    <div class="overview">
      <div class="s_grid_con s_form">
        <ul>
          <li class="s_grid_row">
            <%= f.text_area :paper_title, size: "20x2", placeholder: "Paper Title", class: "s_grid_6 s_grid"%>
          </li>
          <li class="s_grid_row">
            <%= f.text_field :journal_title, size: "20", placeholder: "Journal Title", class: "s_grid_6 s_grid", "autocomplete-list" => "journal_title_autocomplete_list" %>
            <span class="icon-plus input_append"></span>
          </li>
          <li class="s_grid_row">
          <div class="check_box_g">
            <%= label_tag("", "Journal Level") %>
            <ul>
              <% @level_types.each_with_index do |level_type, i| %>
                 <li>
                   <%= check_box_tag "writing_journal[journal_level_type_ids][]",
                                     level_type.id,
                                     @writing_journal.journal_level_type_ids.include?(level_type.id),
                                     id: "field-#{i}"
                   %><%= label_tag("field-#{i}", level_type.title) %>
                 </li>
              <% end %>
            </ul>
            <!--<label for="">Journal Level</label>
            <ul>
              <li><input type="checkbox"><label for="">SCI</label></li>
            </ul>-->
          </div>
          </li>

          <li class="s_grid_row">
            <%= label_tag("", "ISSN(ISBN)", class: "s_grid_2 s_grid") %><%= f.text_field :isbn, size: "20", placeholder: "829872987", class: "s_grid_4 s_grid"%>
          </li>

          <li class="s_grid_row">
            <%= label_tag("", "Volume No.", class: "s_grid_2 s_grid") %><%= f.text_field :vol_no, size: "20", placeholder: "829872987", class: "s_grid_4 s_grid"%>
          </li>

          <li class="s_grid_row">
            <%= label_tag("", "Issue No.", class: "s_grid_2 s_grid") %><%= f.text_field :issue_no, size: "20", placeholder:"829872987", class: "s_grid_4 s_grid"%>
          </li>

          <li class="s_grid_row">
            <%= label_tag("", "Total Pages", class: "s_grid_2 s_grid") %><%= f.text_field :total_pages, size: "20", placeholder:"20", class: "s_grid_4 s_grid"%>
          </li>

          <li class="s_grid_row">
            <%= label_tag("", "Pages", class: "s_grid_2 s_grid") %><%= label_tag("", "from", class: "s_grid_1 s_grid") %><%= f.text_field :form_to_start, size: "10", placeholder: "1", class: "s_grid_1 s_grid"%><%= label_tag("", "to", class: "s_grid_1 s_grid") %><%= f.text_field :form_to_end, size: "10", placeholder: "20", class: "s_grid_1 s_grid"%>
          </li>
        </ul>
      </div>
      <div class="s_grid_con s_form">
        <ul>
          <li class="s_grid_row">
            <%= f.text_area :authors, size: "20x2", placeholder: "Authors", class: "s_grid_6 s_grid", "autocomplete-list" => "coauthor_autocomplete_list"%>
            <span class="icon-plus input_append"></span>
          </li>
          <li class="s_grid_row">

          <select name="writing_journal[journal_author_type_ids][]" id="" class="s_grid s_grid_4">
            <%= options_for_select(
              @author_types.map do |author_type|
                [author_type.title, author_type.id]
              end
            )
          %>
          </select>

          <select name="writing_journal[journal_paper_type_ids][]" id="" class="s_grid s_grid_2">
            <%= options_for_select(
                  @paper_types.map do |paper_type|
                    [paper_type.title, paper_type.id]
                  end
                )
            %>
          </select>
          </li>
          <li class="s_grid_row">
            <%= label_tag("", "Date of Publication", class: "s_grid_3 s_grid") %>
            <%= f.date_select :publication_date, {:use_month_numbers => true, :start_year => Time.now.year, :end_year => 1930, :order => [:year, :month, :day] }, {:class => 's_grid_1 s_grid'} %>
          </li>
          <li class="s_grid_row">
             <%= f.text_field :keywords, size: "20", value: @writing_journal.keywords ||= "Keywords", class: "s_grid_6 s_grid"%>
          </li>

          <li class="s_grid_row">
            <%= f.label :year ,:class => "s_grid_2 s_grid" %>
            <%= select_year((@writing_journal.year ? @writing_journal.year.to_i : DateTime.now.year), {:start_year => DateTime.now.year, :end_year => 1930}, {:name => 'writing_journal[year]', :class => "s_grid_4 s_grid"} ) %>
          </li>

          <li class="s_grid_row">
            <%= f.label :language ,:class => "s_grid_2 s_grid" %>
            <select name="writing_journal[language][]" id="" class="s_grid s_grid_4">
              <%= options_for_select(
                [["Chinese", "Chinese"],
                 ["English", "English"]]
              )
            %>
           </select>
          </li>

          <li class="s_grid_row">
             <%= f.text_field :tag, size: "20", value: "Tag", class: "s_grid_6 s_grid"%>
            <span class="icon-plus input_append"></span>
          </li>
          <li class="s_grid_row">
            <select name="" id="" class="s_grid s_grid_3">
              <option value="">Status</option>
              <option value="">Published</option>
              <option value="">Pending</option>
              <option value="">Writing</option>
            </select>
          </li>
          <li class="s_grid_row">
            <%= label_tag("", "Reference URL", class: "s_grid_2 s_grid") %><%= f.text_field :url, size: "20", placeholder: "www.sample.com", class: "s_grid_4 s_grid"%>
          </li>
        </ul>
      </div>
      <div class="s_grid_con s_form">
        <ul>
          <li class="s_grid_row">
          <table class="s_table">
            <thead>
              <tr>
                <th class="s_grid_2">File</th>
                <th class="s_grid_3">File Name</th>
                <th class="s_grid_1">Action</th>
              </tr>
            </thead>
            <tfoot>
              <tr>
                <td colspan="3">
                  <div id='add_plugin_file' class="info_input plugin_files_block s_action">
                    <%= hidden_field_tag 'plugin_file_field_count', @writing_journal.writing_journal_files.count %>
                    <a class="add setting_btn thmc1 thmtxt w1 hh2 hp" href=""><i class="icon-plus icon-white"></i> add</a>
                  </div>
                </td>
              </tr>
            </tfoot>
            <tbody>
              <% @writing_journal.writing_journal_files.each_with_index do |writing_journal_file, i| %>
                <%= f.fields_for :writing_journal_files, writing_journal_file do |f| %>
                  <%= render :partial => 'form_file', :object => writing_journal_file, :locals => {:f => f, :i => i} %>
                <% end %>
              <% end %>
            </tbody>
          </table>
          </li>
      </div>
      <div class="s_grid_con s_form">
        <ul>
          <li class="s_grid_row">
            <%= f.text_area :note, size: "20x22", placeholder: "Note", class: "s_grid_6 s_grid full_height"%>
          </li>
        </ul>
      </div>
      <div class="s_grid_con s_form">
        <ul>
          <li class="s_grid_row">
            <%= f.text_area :abstract, size: "20x22", placeholder: "Abstract", class: "s_grid_6 s_grid full_height"%>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript">
  orbitDesktop.prototype.initializeJournalPapers.journal_title_autocomplete_list = <%= @journal_candidate.to_json.html_safe   %>; 
  orbitDesktop.prototype.initializeJournalPapers.coauthor_autocomplete_list = <%= @co_author_candidate.to_json.html_safe  %>;
</script>


<%= javascript_include_tag "archive_plugin_form" %>
<script>
  $('#add_plugin_file a.add').click(function(){
    var new_id = $(this).prev().attr('value');
    var old_id = new RegExp("new_writing_journal_files", "g");
    $(this).prev().attr('value', parseInt(new_id) + 1);
    var newfield = $(("<%= escape_javascript(add_attribute 'form_file', f, :writing_journal_files) %>").replace(old_id, new_id));
    $(this).parents('table').append(newfield);
    newfield.find('.action a.delete').click(function(){
     newfield.remove();
   });
    return false;
  });

  $('.action a.remove_existing_record').click(function(){
    $(this).next('.should_destroy').attr('value', 1);
    $("tr#add_plugin_file_" + $(this).prev().attr('value')).hide();
  });

</script>