我有一个显示在 html 页面中的调查，我想在单击提交按钮后将用户输入的数据传递到另一个 php 页面
json文件
var $surveyCont = $('[data-surveyjs-wrapper]'),
$surveyForm = $surveyCont.find('[data-surveyjs-form]'),
$surveyBtn = $surveyForm.find('.surveyjs-submit-btn');
var formEl = document.querySelector('[data-surveyjs-form]');
var options = {
url: 'json/survey.json',
cssClasses: {
select: 'custom-select'
},
templates: {
wrapper: {
field: '<div class="surveyjs-field-container surveyjs-{{answerType}}-wrapper abc-{{answerType}}">'+
'{{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 ){
console.log('Survey formOptions.beforeSend call...', data);
if( !data.stopExecution ){
$surveyBtn.addClass('surveyjs-submit-sending');
$surveyCont.find('.alert').remove();
}
return Promise.resolve(data);
}
}
};
var onInitSuccess = function( ajaxData ){
if( ajaxData.status === 'success' ){
console.log('init slider');
$('.stackSlider').stackslider({ piles : false });
} else {
onInitError.call(this);
}
},
onInitError = function( error ){
var surveyFormEl = this.formEl;
surveyFormEl.querySelector('.surveyjs-body').innerHTML = '<div class="surveyjs-message">Loading Error. Please, reload the page.</div>';
},
onValidation = function( fields ){
console.log( 'onValidation', fields );
if( fields.length > 1 ){
if( !formEl.querySelector('[type="submit"]').disabled ){
return;
}
// GO TO THE FIRST UNANSWERED QUESTION
var $stWrapper = $('.surveyjs-form .st-wrapper'),
activeIndex = $stWrapper.find('.st-center').index(),
$invalidField = (function(){
for( var f=0; f<fields.length; f++ ){
var obj = fields[f];
if( !obj.result && !$(obj.fieldEl).is('[data-field]') ){
return $(obj.fieldEl);
}
}
return $();
})();
if( $invalidField.length ){
var invalidIndex = $invalidField.closest('.st-item').index(),
clickDirection = ( activeIndex > invalidIndex ? 'prev' : 'next' ),
$btn = ( clickDirection === 'prev' ? $stWrapper.find('nav > span:first-child') : $stWrapper.find('nav > span:last-child') ),
clicksLength = ( clickDirection === 'prev' ? activeIndex - invalidIndex : invalidIndex - activeIndex );
for(var i=0; i<clicksLength; i++){
$btn.trigger('click.stackslider');
}
}
} else {
console.log('validating field ', fields[0]);
}
}
;
formEl.addEventListener('fjs.field:validation', function(event){
console.log(event.type);
onValidation([event.data]);
});
formEl.addEventListener('fjs.form:validation', function(event){
console.log(event.type);
onValidation(event.data.fields);
});
formEl.addEventListener('fjs.form:submit', function(event){
console.log(event.type);
event.data
.then(function(ajaxData){
console.log('then', ajaxData);
if( typeof ajaxData === 'string' ){
try{
ajaxData = JSON.parse(ajaxData);
} catch(error){
throw new Error('String returned from ajax call to "' + ajaxOptions.url + '" is not a valid JSON string');
}
}
if( $.isPlainObject( ajaxData ) ){
if( ajaxData.status === 'success' ){
// REMOVE THE SURVEY FROM THE PAGE
const dat = require('json/survey.json');
console.log(dat);
var obj = JSON.parse(dat);
var a= (obj.question1);
$surveyCont.remove();
window.location.replace("insert1.php?a="+a);
// OPEN THE BOOTSTRAP MODAL TO SHOW A CONGRATULATION MESSAGE
$('#modal-notification').modal('show');
} else {
// PRINT THE ERROR MESSAGE AFTER THE FORM
$surveyCont.append( '<div class="alert alert-danger text-center" role="alert"><p class="my-3">Generic error, please retry.</p></div>' );
}
}
})
.catch(function(error){
console.log('catch', error);
// PRINT THE ERROR MESSAGE AFTER THE FORM
$surveyForm.closest('.surveyjs-wrapper').append( '<div class="alert alert-danger text-center" role="alert"><p class="my-3">Generic error, please retry.</p></div>' );
})
.finally(function(){
console.log('finally');
$surveyBtn.removeClass('surveyjs-submit-sending');
});
});
formEl.addEventListener('sjs:init', function(event){
console.log(event.type);
event.data
.then(function( data ){
console.log('Survey init then');
console.log(data);
onInitSuccess.call(mySurvey, data);
})
.catch(function( error ){
console.log('Survey init catch');
console.log(error);
onInitError.call(mySurvey, error);
});
}, false);
var mySurvey = new Survey( formEl, options ); <form action="json/survey.json" name="surveyjs-form" class="surveyjs-form surveyjs-cards" 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="surveyjs-errors-wrapper small">
To go on you must select an answer.
</div>
</div>
<button id="btn" name="btn" class="surveyjs-submit-btn btn btn-red d-block mx-auto" type="submit">
<span class="surveyjs-submit-text">ارسال</span>
</button>
</div>
</form>{
"status": "success",
"data": {
"id": 1,
"questions": [
{
"id": "1b",
"question": "ستظهر لك الأسئله والخيارات أسفلها للاجابه عنها",
"answers": [
{ "id": "1ba", "type": "hidden" }
],
"sort": 1
},
{
"id": "1c",
"question": "يمكنك دوماً ان تختار (أفضل عدم التحديد) ان اردت أن تبقي هويتك سرية",
"answers": [
{ "id": "1ca", "type": "hidden" }
],
"sort": 2
},
{
"id": "0",
"question": "اجاباتك ستظهر لهذا الشخص لكي يخمن من انت / اضغط على الاسهم بالأعلى للتنقل بين الاسئلة",
"answers": [
{ "id": "0a", "type": "hidden" }
],
"sort": 0
},
{
"id": "2",
"question1": "النوع : ",
"answers": [
{ "id": "7", "value": "value-7", "type": "radio", "label": "أنثى", "sort": 2 },
{ "id": "8", "value": "value-8", "type": "radio", "label": "أفضل عدم التحديد", "sort": 3 },
{ "id": "10", "value": "value-10", "type": "radio", "label": "ذكر", "sort": 1 }
],
"required": true,
"sort": 3
},
{
"id": "3",
"question5": "ماذا تود أن تقول عن هذا الشخص:",
"answers": [
{ "id": "18", "type": "textarea", "maxlength": 300, "rows": 6, "placeholder": "رأيك فيني :)" }
],
"required": true,
"sort": 7
},
{
"id": "6",
"question4": "مكان تواجدك الحالي : ",
"answers": [
{ "id": "21a", "value": "value-21a", "type": "radio", "label": "أفضل عدم التحديد", "sort": 3 },
{ "id": "21b", "value": "value-21b", "type": "radio", "label": "السودان", "sort": 1 },
{ "id": "21c", "value": "value-21c", "type": "radio", "label": "خارج السودان", "sort": 2 }
],
"required": true,
"sort": 5
},
{
"id": "8",
"question3": "منذ متى تعرف ه1ا الشخص?",
"answers": [
{ "id": "159", "value": "", "type": "option", "label": "اختر اجابة", "sort": 1 },
{ "id": "160", "value": "value-160", "type": "option", "label": "أقل من سنة", "sort": 2 },
{ "id": "161", "value": "value-161", "type": "option", "label": "من سنة إلى خمس سنوات", "sort": 3 },
{ "id": "162", "value": "value-162", "type": "option", "label": "أكثر من خمس سنوات", "sort": 4 },
{ "id": "163", "value": "value-163", "type": "option", "label": "أفضل عدم التحديد", "sort": 5 }
],
"required": true,
"sort": 6
},
{
"id": "10",
"question2": "نوع العلاقة?",
"answers": [
{ "id": "43", "value": "value-43", "type": "checkbox", "label": "صديق", "sort": 1 },
{ "id": "44", "value": "value-44", "type": "checkbox", "label": "عائلة", "sort": 2 },
{ "id": "45", "value": "value-45", "type": "checkbox", "label": "كراش", "sort": 3 },
{ "id": "46", "value": "value-46", "type": "checkbox", "label": "أفضلا عدم التحديد", "sort": 4 }
],
"checks": "[1,2]",
"required": true,
"sort": 4
}
]
}
}