add page completed with attributes and reordering

This commit is contained in:
Harry Bomrah 2013-09-17 15:11:59 +08:00 committed by saurabhbhatia
parent e4a16eab3a
commit 1e3cffee0a
2 changed files with 14 additions and 4 deletions

View File

@ -8,7 +8,6 @@ function checkQuestionsLength() {
}; };
}; };
// Role Attribute Template Data // Role Attribute Template Data
function setData(l, length, optionsI, className) { function setData(l, length, optionsI, className) {
if(!optionsI) { if(!optionsI) {
@ -104,6 +103,15 @@ $(function() {
event.preventDefault(); event.preventDefault();
/* Act on the event */ /* Act on the event */
}); });
$(".questions").sortable({
update : function ( event, ui ){
$(".questions .attributes").each( function ( i ){
$( this ).find( "input.sequence" ).val( i );
$( this ).find( "h4 span:eq(0)" ).text( i + 1 );
$( this ).attr( "data-index", i );
})
}
});
$('.questions').on(clickEvent, '.add-btn a, .remove-input, .delete, .attributes-header h4 i, .btn-group .btn', function(event) { $('.questions').on(clickEvent, '.add-btn a, .remove-input, .delete, .attributes-header h4 i, .btn-group .btn', function(event) {
if($(this).hasClass('remove-input')){ if($(this).hasClass('remove-input')){
@ -113,7 +121,7 @@ $(function() {
$(this).remove(); $(this).remove();
checkQuestionsLength(); checkQuestionsLength();
$('.questions > .attributes').each(function(index, el) { $('.questions > .attributes').each(function(index, el) {
$(this).find('h4').find('span').text(index + 1); $(this).find('h4').find('span:eq(0)').text(index + 1);
}); });
}); });
} else if($(this).hasClass('icon-caret-up') || $(this).hasClass('icon-caret-down')) { } else if($(this).hasClass('icon-caret-up') || $(this).hasClass('icon-caret-down')) {
@ -129,13 +137,15 @@ $(function() {
$tabPane = $(this).closest('.btn-group').siblings('.tab-content'); $tabPane = $(this).closest('.btn-group').siblings('.tab-content');
$questionsTitle.text($tabPane.find('div').not('.active').children('input[type="text"]').val()) $questionsTitle.text($tabPane.find('div').not('.active').children('input[type="text"]').val())
} else { } else {
var _i = $('.questions .attributes').length, var _i = $(this).closest('.control-group').data('index') || 1,
_className = $(this).closest('.control-group').attr('class').match(/options|rgl/g)[0], _className = $(this).closest('.control-group').attr('class').match(/options|rgl/g)[0],
_index = $(this).closest('.attributes').data().index, _index = $(this).closest('.attributes').data().index,
_length = $(this).closest('.add-btn').siblings('.input-append').length; _length = $(this).closest('.add-btn').siblings('.input-append').length;
console.log(_i) console.log(_i)
$('#template-survery-option').tmpl(setData(_index, "", _i, _className)).insertBefore($(this).closest('.add-btn')); $('#template-survery-option').tmpl(setData(_index, "", _i, _className)).insertBefore($(this).closest('.add-btn'));
$(this).closest('.add-target').find('.input-append').find('.remove-input').removeClass('hide').prev().removeClass('last'); $(this).closest('.add-target').find('.input-append').find('.remove-input').removeClass('hide').prev().removeClass('last');
_i += 1
$(this).closest('.control-group').data('index', _i)
} }
event.preventDefault(); event.preventDefault();
}); });

View File

@ -3,7 +3,7 @@
<div class="attributes-header clearfix"> <div class="attributes-header clearfix">
<a class="btn btn-mini pull-right btn-danger delete" href="#"><i class="icon-trash"></i> Delete</a> <a class="btn btn-mini pull-right btn-danger delete" href="#"><i class="icon-trash"></i> Delete</a>
<input class="should_destroy" id="${_destroy[0]}" name="${_destroy[1]}" type="hidden"> <input class="should_destroy" id="${_destroy[0]}" name="${_destroy[1]}" type="hidden">
<input id="${_sequence[0]}" name="${_sequence[1]}" type="hidden" value="${_length - 1}"> <input id="${_sequence[0]}" class="sequence" name="${_sequence[1]}" type="hidden" value="${_length - 1}">
<h4><b></b> Q<span>${_length}</span> <i class="icon-caret-up"></i> <span class="questions-title"></span></h4> <h4><b></b> Q<span>${_length}</span> <i class="icon-caret-up"></i> <span class="questions-title"></span></h4>
</div> </div>
<div class="attributes-body"> <div class="attributes-body">