<script type="text/javascript" charset="utf-8">
 
    $(document).on('ready pjax:scriptcomplete',function(){
 
        // Identify the questions
        var qArrayID = {QID};
        var qArray = $('#question'+qArrayID);
        var arrayLength = $('tr.answers-list', qArray).length;
        var qUploads = qArray.nextAll('.upload-files:lt('+arrayLength+')');
        var qMultiText = qArray.nextAll('.multiple-short-txt:eq(0)');
 
        // Add some classes
        qArray.addClass('array-with-uploads-question');
        $(qUploads).each(function(i) {
            $(this).addClass('uploads-question index-'+i).css({
                'position': 'absolute',
                'left': '-9999em'
            });
        });
 
        // Hide the multi-short-text question
        $(qMultiText).hide();
 
 
        // Insert the "Upload" buttons and a column for the text inputs
        $('table.questions-list colgroup', qArray).append('<col />');
        var tableWidth = $('table.questions-list:eq(0)', qArray).width();
        var answerWidth = $('col.ls-col-odd:eq(0)', qArray).width();
        var answerWidthPercent = (answerWidth/tableWidth)*100;
        var answersLength = $('col.ls-col-odd, col.ls-col-even', qArray).length;
        var answerWidthPercent2 = (answerWidthPercent*answersLength)/(answersLength+2)
        $('table.questions-list col', qArray).removeAttr('width');
        $('table.questions-list col:not(.col-answers)', qArray).css('width', answerWidthPercent2+'%');
        $('table.questions-list col:not(.col-answers)', qArray).css('width', 'auto');
        $('table.questions-list thead tr', qArray).append('<th class="answer-text inserted-column-label" /><td />');
        $('tr.answers-list', qArray).each(function(i) {
            $(this).append('<td class="answer-item text-item">\
                            </td>\
                            <td class="answer-item">\
                                <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#upload-'+qArrayID+'-'+(i+1)+'" data-backdrop="static" data-keyboard="false">Enviar arquivo</button>\
                            </td>');
        });
 
        // Load the column label for the text inputs
        $('.inserted-column-label:eq(0)', qArray).text($('.ls-label-question', qMultiText).text());
        $('.text-item', qArray).prepend('<label class="ls-label-xs-visibility">'+$('.ls-label-question', qMultiText).text()+'</label>')
 
        // Loop through the multi-short-text sub-questions
        $('li.answer-item', qMultiText).each(function(i) {
            // Move the text inputs into the array
            $('input[type="text"]', this).appendTo($('tr.answers-list:eq('+i+') .text-item', qArray));
        });
 
        // Loop through the upload questions
        $(qUploads).each(function(i) {
            // Create a modal
            $('body').append('<div class="modal upload-modal" id="upload-'+qArrayID+'-'+(i+1)+'" tabindex="-1" role="dialog">\
                                <div class="modal-dialog" role="document">\
                                    <div class="modal-content">\
                                        <div class="modal-header">\
                                            <h5 class="modal-title">'+$('.ls-label-question', this).html()+'</h5>\
                                        </div>\
                                        <div class="modal-body">\
                                        </div>\
                                        <div class="modal-footer">\
                                            <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Fechar</button>\
                                        </div>\
                                    </div>\
                                </div>\
                            </div>');
 
            // Move this question into the modal
            $('#upload-'+qArrayID+'-'+(i+1)+' .modal-body').append($(this));
            $(this).css({
                'position': 'relative',
                'left': 'auto'
            });
        });
 
        // Interrupt the Next/Submit function (to put upload questions back in the form)
        $('#ls-button-submit').on('click', function(e) {        
            $('.upload-modal').each(function(i) {
                $('.upload-files', this).css({
                    'position': 'absolute',
                    'left': '-9999em'
                });
                $('.group-container').append($('.upload-files', this));
            });
        });    
    });
</script>

<script type="text/javascript" charset="utf-8">
 
    $(document).on('ready pjax:scriptcomplete',function(){
 
        // Identify the questions
        var thisQID = {QID};
        var thisQuestion = $('#question'+thisQID);
        var subquestionsLength = $('.answer-item', thisQuestion).length;
        var qUploads = thisQuestion.nextAll('.upload-files:eq(0)');
 
        // Add some classes
        $(qUploads).addClass('uploads-question index-'+i).css({
            'position': 'absolute',
            'left': '-9999em'
        });
 
          // Insert the comments buttons
        $('.answer-item:last', thisQuestion).each(function(i) {
        $('input:text', this).after("\n\n\n<br>"+'<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#uploads-'+thisQID+'-'+(i+1)+'" data-backdrop="static" data-keyboard="false">Comprovante de endereço</button>');
        });
 
        // Handle comments
        $(qUploads).each(function(i) {
            // Create modals
            $('body').append('<div class="modal uploads-modal" id="uploads-'+thisQID+'-'+(i+1)+'" tabindex="-1" role="dialog">\
                                <div class="modal-dialog" role="document">\
                                    <div class="modal-content">\
                                        <div class="modal-header">\
                                            <h5 class="modal-title">'+$('.ls-label-question', this).html()+'</h5>\
                                        </div>\
                                        <div class="modal-body">\
                                        </div>\
                                        <div class="modal-footer">\
                                            <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Fechar</button>\
                                        </div>\
                                    </div>\
                                </div>\
                            </div>');
 
            // Move the Upload questions into modals
            $('#uploads-'+thisQID+'-'+(i+1)+' .modal-body').append($('.ls-answers', this));
 
        });
 
        // Interrupt the Next/Submit function (to put comments back in the form)
        $('#limesurvey').submit(function(e) {
            $('.uploads-modal[id^="uploads-'+thisQID+'-"]').each(function(i) {
                var qID = $('input:eq(0)', this).attr('id').split('X')[2];
                $('#question'+qID+' .answer-container').append($('.ls-answers', this));
            });
        });    
    });
</script>