<div class="surveyjs-wrapper surveyjs-custom-inputs panel" data-surveyjs-wrapper>
    <div class="panel-body">
        <form action="../json/survey.json" name="surveyjs-form" class="surveyjs-form" data-surveyjs-form novalidate>
            <div class="surveyjs-body questionsList stackSlider" data-surveyjs-body></div>
            <div class="surveyjs-footer row">
                <div class="surveyjs-question-wrapper text-right" data-formjs-question data-surveyjs-external="1">
                    <div class="surveyjs-answers-wrapper form-group">
                        <div class="text-left small" data-question></div>
                        <div class="form-check-inline abc-radio" data-answer>
                            <input class="form-check-input" name="surveyjs-answer-external" data-exclude-storage data-field/>
                            <label class="surveyjs-label form-check-label">
                                <span data-label></span>
                            </label>
                        </div>
                        <div class="form-check-inline abc-radio" data-answer>
                            <input class="form-check-input" name="surveyjs-answer-external" data-exclude-storage data-field/>
                            <label class="surveyjs-label form-check-label">
                                <span data-label></span>
                            </label>
                        </div>
                    </div>
                    <div class="surveyjs-errors-wrapper small mb-4">
                        To go on you must select an answer.
                    </div>
                </div>
                <button class="surveyjs-submit-btn btn btn-red d-block mx-auto" type="submit">
                    <span class="surveyjs-submit-text">SEND</span>
                </button>
            </div>
        </form>
    </div>
</div>

// FULL CODE: /js/demos/demo-stackslider-2.js
const $form = document.querySelector('[data-surveyjs-form]');
const options = {
    url: '../json/survey.json',
    cssClasses: {
        select:         'custom-select'
    },
    templates: {
        wrapper: {
            field:      '<div class="surveyjs-field-container surveyjs-{{answerType}}-wrapper abc-{{answerType}} {{wrapperClasses}}">'+
                            '{{fieldTemplate}}'+
                            '{{labelTemplate}}'+
                        '</div>',

            question:   '<div class="st-item" data-title="#{{questionNumber}}">'+
                            '<div data-question-id="{{questionId}}" data-formjs-question class="surveyjs-question-wrapper">'+
                                '<div class="surveyjs-question-text">{{questionText}}</div>'+
                                '<div class="surveyjs-answers-wrapper form-group">'+
                                    '{{answersHTML}}'+
                                '</div>'+
                            '</div>'+
                        '</div>',
            
            related:    '<div class="surveyjs-field-wrapper surveyjs-related-wrapper input-group">'+
                            '<div class="input-group-prepend form-check abc-radio surveyjs-answer-radio">'+
                                '<div class="input-group-text">'+
                                    '{{fieldTemplate}}'+
                                    '{{labelTemplate}}'+
                                '</div>'+
                            '</div>'+
                            '{{relatedFieldHTML}}'+
                        '</div>'
        }
    },
    formOptions: {
        beforeSend: function beforeSend_doc( data ){...}
    }
};

const onValidation = fields => {...};

const onInitSuccess = function( ajaxData ){
    const $surveyForm = this.$form,
          surveyBody = $surveyForm.querySelector('.surveyjs-body'),
          initStatus = ajaxData.status;
    
    if( initStatus === 'success' ){
        $('.stackSlider').stackslider({ piles : false });
    } else {
        const elemToRemove = $surveyForm.querySelector('.surveyjs-footer');
        elemToRemove.parentNode.removeChild(elemToRemove);
        surveyBody.innerHTML = '<div class="surveyjs-message">Loading Error. Please, reload the page.</div>';
    }
};

$form.addEventListener('fjs.field:validation', event => {
    onValidation([event.detail]);
});

$form.addEventListener('fjs.form:validation', event => {
    onValidation(event.detail.fields);
});

$form.addEventListener('fjs.form:submit', event => {
    event.detail
        .then(ajaxData => {...})
        .catch(error => {...})
        .finally(() => {...});
});

$form.addEventListener('sjs:init', event => {
    event.detail
        .then(data => {
            onInitSuccess.call(mySurvey, data);
        })
        .catch(error => {...});
});

const mySurvey = new Survey( $form, options );