survey/app/views/admin/surveys/pagination_setting.erb

177 lines
5.8 KiB
Plaintext

<% if @survey_sections_len>0 %>
<%= javascript_include_tag "lib/jquery.tmpl.min.js" %>
<%= form_for @survey, :url => {:action => "save_pagination_setting"}, :html => {:class => "form-horizontal main-forms", :id => 'pagination_form',data: {"min-section" => @min_section,"max-section" => @max_section}} do |f| %>
<fieldset>
<table class="table" id="survey_pagination_table">
<thead>
<th><%= t('survey.pagination') %></th>
<th><%= t('survey.start_section') %></th>
<th><%= t('survey.end_section') %></th>
<th></th>
</thead>
<tbody>
</tbody>
</table>
<script id="pagination_form_template" type="text/x-custom-template">
<tr class="${_type}">
<td>
{{if _id}}
<%= hidden_field_tag "${_name}[${_i}][_destroy]", "${_destroy}", class: 'should_destroy', id: "${_id_prefix}destroy" %>
<%= hidden_field_tag "${_name}[${_i}][_id]", "${_id}", class: 'id', id: "${_id_prefix}id" %>
{{/if}}
<%= hidden_field_tag "${_name}[${_i}][index]", "${_index}", class: "index", id: "${_id_prefix}index" %>
<%= label_tag nil,"${_index}", class: 'index', id: nil %>
</td>
<td>
<select id="${_id_prefix}start_section" name="${_name}[${_i}][start_section]" class="start_section">
<% (@min_section..@max_section).each do |index| %>
<option value="<%= index %>" {{if _start_section == "<%= index %>"}}selected="selected"{{/if}}>
<%= index %>
</option>
<% end %>
</select>
</td>
<td>
<select id="${_id_prefix}end_section" name="${_name}[${_i}][end_section]" class="end_section">
<% (@min_section..@max_section).each do |index| %>
<option value="<%= index %>" {{if _end_section == "<%= index %>"}}selected="selected"{{/if}}>
<%= index %>
</option>
<% end %>
</select>
</td>
<td><%= f.button t('delete_'), type: 'button', class: 'btn btn-danger remove-btn' %></td>
</tr>
</script>
<script type="text/javascript">
function setData(d,i){
if (d==null){
var _destroy = '0',
_i = $('#survey_pagination_table tbody>tr').length,
_index = _i+1,
_start_section = null,
_end_section = null,
_id = null,
_type = 'new'
}else{
var _destroy = '0',
_i = i
_index = d.index,
_start_section = d.start_section,
_end_section = d.end_section,
_id = d._id,
_type = 'old'
}
var data = {
_id_prefix: "survey_survey_paginations_"+_i+'_',
_name: "survey[survey_paginations]",
_destroy: _destroy,
_i: _i,
_index: _index,
_start_section: _start_section,
_end_section: _end_section,
_id: _id,
_type: _type
}
return data
}
function check_max_sections(value) {
var max_section = $('#pagination_form').data('max-section')
var flag = value ? value != max_section : value==$('.end_section').length==0 || $('.end_section').eq(-1).val()!=max_section
if (!flag){
$('.add-pagination').hide()
}else{
$('.add-pagination').show()
}
return flag;
}
function disable_first_start_section() {
if ($('.start_section:visible').length==1){
$('.start_section:visible').eq(0).attr('disabled','')
}
}
function check_section_num(){
var start_section_val = parseInt($('#pagination_form tbody .end_section').eq(0).val()) + 1,
delete_index = 1,
max_section = parseInt($('#pagination_form').data('max-section'))
$('#pagination_form tbody').find('tr:visible:not(:first-child)').each(function(){
if (max_section<start_section_val){
return false;
}
$(this).find('.start_section').val(start_section_val)
var end_section = $(this).find('.end_section'),
val = parseInt(end_section.val())
if (val<start_section_val){
end_section.val(start_section_val)
}
start_section_val++;
delete_index++;
})
check_max_sections(start_section_val-1)
var list = $('#pagination_form tbody').find('tr:visible')
for (var i=delete_index;i<list.length;i++){
list.eq(i).find('.remove-btn').click()
}
}
$(function() {
var pagination_settings = <%= @pagination_settings.to_json.html_safe %>;
$.each(pagination_settings,function(i,v){
var html = $('#pagination_form_template').tmpl(setData(v,i))
$('#pagination_form tbody').append(html)
})
$('#survey_pagination_table tbody')
$('.add-pagination').click(function(){
if (check_max_sections()){
var html = $('#pagination_form_template').tmpl(setData())
$('#pagination_form tbody').append(html)
disable_first_start_section()
check_section_num()
}
})
$('#pagination_form').on(clickEvent, '.remove-btn', function(event) {
var parent = $(this).parents('tr')
if (parent.hasClass('new')){
parent.remove()
}else{
parent.find('should_destroy').val('1')
parent.hide()
}
disable_first_start_section()
$('label.index:visible').each(function(i,v){
$(this).text(i+1)
$(this).parents('tr').find('input.index').val(i+1)
})
check_max_sections()
})
check_max_sections()
})
$('#pagination_form').on('change', '.end_section', function(event) {
var end_section_val = $(this).val(),
start_section_val = $(this).parents('tr').find('.start_section').val()
if (end_section_val<start_section_val){
end_section_val = start_section_val
$(this).val(end_section_val)
}
check_section_num()
})
$('#pagination_form').on('change', '.start_section', function(event) {
var start_section_val = $(this).val(),
end_section_val = $(this).parents('tr').find('.end_section').val()
if (end_section_val<start_section_val){
start_section_val = end_section_val
$(this).val(start_section_val)
}
check_section_num()
})
</script>
<%= f.button t('survey.add_pagination'),type: 'button',class: 'btn btn-success add-pagination' %>
<%= f.submit t('submit'), class: 'btn btn-primary' %>
</fieldset>
<% end %>
<% else %>
<h1>
<%= t('survey.no_section_hint') %>
</h1>
<% end %>