survey/app/views/admin/surveys/_section_form.html.erb

<% content_for :page_specific_css do %>
  <%= stylesheet_link_tag "lib/main-forms" %>
  <%= stylesheet_link_tag "lib/wrap-nav" %>
  <%= stylesheet_link_tag "lib/main-list" %>
<% end %>
<% content_for :page_specific_javascript do %>
  <%= javascript_include_tag "jquery-ui-custom.js" %>
<% end %>
<div class="input-area">
	<div class="control-group">
      <label class="control-label muted" for=""><%= t('survey.title') %></label>
      <div class="controls">
        <div class="input-append">
          <div class="tab-content">
            <% @site_in_use_locales.each_with_index do |locale, i| %>
            <div class="tab-pane fade <%= ( i == 0 ) ? "active in" : '' %>" id="title_<%= locale %>">
                <%= f.fields_for :section_title_translations do |f| %>
                  <%= f.text_field locale, :value => (@section.section_title_translations[locale] rescue nil), :placeholder=>"#{t("survey.section_title")}" %>
                <% end %>
            </div>
            <% end %>
          </div>
          <div class="btn-group" data-toggle="buttons-radio">
             <% @site_in_use_locales.each_with_index do |locale, i| %>
                <a class="btn <%= ( i == 0 ) ? "active" : '' %>" href="#title_<%= locale %>" data-toggle="tab"><%= t(locale.to_s) %></a>
              <% end %>
          </div>
        </div>
      </div>
    </div>

    <!-- Description -->
    <div class="control-group">
      <label class="control-label muted"><%= t('survey.section_description') %></label>
      <div class="controls">
        <div class="tab-content textarea-lang">
          <div class="btn-group" data-toggle="buttons-radio">
            <% @site_in_use_locales.each_with_index do |locale, i| %>
              <a class="btn <%= ( i == 0 ) ? "active" : '' %>" href="#textarea_<%= locale %>_0" data-toggle="tab"><%= t(locale.to_s) %></a>
            <% end %>
          </div>
          <% @site_in_use_locales.each_with_index do |locale, i| %>
             <div class="tab-pane fade in <%= ( i == 0 ) ? "active" : '' %>" id="textarea_<%= locale %>_0">
              <%= f.fields_for :section_description_translations do |f| %>
                <%= f.text_area locale, :class=>'resizable', :value => (@section.section_description_translations[locale] rescue nil), :placeholder => "#{t("survey.section_description")}", :rows=>"3" %>
              <% end %>
             </div>
          <% end %>
        </div>
      </div>
    </div>

    <div class="control-group">
			<%= f.label :start_question, t("survey.start_question"), :class => "control-label muted" %>
      <div class="controls">
      	<% if @section.new_record? %>
	      	<% if @survey.survey_sections.count == 0 %>
	         <%= f.number_field :start_question, :min => 1, :max => (@survey.survey_questions.count - 1), :value => (@survey.survey_sections.count + 1) %>
	        <% else %>
	        	<% min_value = @survey.survey_sections.last.end_question %>
	        	<%= f.number_field :start_question, :max => (min_value + 1), :min => (@survey.survey_questions.count - 1), :value => (min_value + 1) %>
	        <% end %>
        <% else %>
        	<% if @survey.survey_sections.count == 0 %>
         		<%= f.number_field :start_question, :min => 1, :max => (@survey.survey_questions.count - 1) %>
         	<% else %>
         		<% if @section.order > 0 %>
		        	<% min_value = @survey.survey_sections.where(:order => @section.order - 1).first.end_question %>
		        	<%= f.number_field :start_question, :min => (min_value + 1), :max => (@survey.survey_questions.count - 1) %>
		        <% else %>
		        	<%= f.number_field :start_question, :min => 1, :max => (@survey.survey_questions.count - 1) %>
		        <% end %>
	        <% end %>
        <% end %>
      </div>
    </div>

     <div class="control-group">
			<%= f.label :end_question, t("survey.end_question"), :class => "control-label muted" %>
      <div class="controls">
      	<% if @section.new_record? %>
      		<% if @survey.survey_sections.count == 0 %>
        	 <%= f.number_field :end_question, :min => (@survey.survey_sections.count+1), :max => (@survey.survey_questions.count+2), :value => (@survey.survey_sections.count + 2) %>
        	<% else %>
	        	<% min_value = @survey.survey_sections.last.end_question %>
	        	<%= f.number_field :end_question, :min => (min_value+1), :max => (min_value + 2), :value => (min_value + 2) %>
	        <% end %>
        <% else %>
        	<% if @survey.survey_sections.count == 0 %>
         		<%= f.number_field :end_question, :min => (@survey.survey_sections.count), :max => @survey.survey_questions.count %>
         	<% else %>
         		<% if @section.order > 0 %>
		        	<% min_value = @survey.survey_sections.where(:order => @section.order - 1).first.end_question %>
		        	<%= f.number_field :end_question, :min => (min_value + 1), :max => (@survey.survey_questions.count) %>
		        <% else %>
		        	<%= f.number_field :end_question, :min => 1, :max => (@survey.survey_questions.count) %>
		        <% end %>
	        <% end %>
        <% end %>
      </div>
    </div>
    <div class="control-group">
			<%= f.label :qnum_mode, t("survey.question_number_setting"), :class => "control-label muted" %>
      <div class="controls">
        <%= f.select :qnum_mode, ['show','disable','restart',].map.with_index{|v,i| [t("survey.#{v}_question_number"),i]} %>
    </div>
</div>
<div class="form-actions">
	<%= f.hidden_field :questionnaire_survey_id, :value => @survey.id %>
	<% if @section.new_record? %>
		<%= f.hidden_field :order, :value => @survey.survey_sections.count %>
	<% end %>
  <%= f.submit t('save'), :class=>'btn btn-primary' %>
</div>
<script type="text/javascript">
	var current_start_value = 1,
			current_end_value = 1;
	$("#survey_section_start_question").on("focus",function(){
		current_start_value = parseInt($(this).val());
	})
	$("#survey_section_end_question").on("focus",function(){
		current_end_value = parseInt($(this).val());
	})
	$("#survey_section_end_question").on("change",function(){
		var number = parseInt($(this).val());
		if(number > parseInt($(this).attr("max")) || number < parseInt($(this).attr("min"))){
      $(this).val(current_end_value);
      return false;
    }
	})
	$("#survey_section_start_question").on("change",function(){
		var number = parseInt($(this).val());
		if(number > parseInt($(this).attr("max")) || number < parseInt($(this).attr("min"))){
			$(this).val(current_start_value);
			return false;
		}
		$("#survey_section_end_question").attr("min", number+1);
		if(parseInt($("#survey_section_end_question").val()) < number){
			$("#survey_section_end_question").val(number);
		}
	})
</script>