我正在创建递归数据集。我几乎完成了它，但是当我在选项内添加问题时，嵌套子项面临一个问题，因此如果我添加索引3，它的添加时间应该是两次，因此它会自动添加另外两个索引4和5。添加嵌套问题和嵌套选项。我正在使用avgrund插件进行弹出。
var ParentIndex = 1;
var QuestionIndex = 1;
var OptionIndex = 1;
var Question = {};
var Model = null;
$(function(){
'use strict';
$('body').on('click','[data-type=OQ]',function(){
$(this).CreateQuestion();
});
$('body').on('click','[data-type=OPO]',function(){
$(this).CreateOption();
});
});
$.fn.extend({
CreateQuestion: function(){
var Parent = parseInt($(this).attr('data-parent'));
Parent = isNaN(Parent) ? null : Parent;
Model = $(this).avgrund({
height: 500,
holderClass: 'custom',
closeByEscape: true,
closeByDocument: true,
showClose: true,
showCloseText: 'x',
onBlurContainer: '.container-scroller',
template: '<form name="AddQuestion"> <div class="row"> <div class="col-sm-12"> <div class="form-group"><label>Title</label><input type="text" class="form-control" name="Title"/></div></div><div class="col-sm-12"> <div class="form-group"><label>Role</label><select name="Role" class="form-control">'+(Roles)+'</select></div></div><div class="col-sm-6"> <div class="form-group"> <label>Weight</label> <div class="input-group"><input class="form-control" placeholder="Weight" name="Weight" type="text"/><span class="input-group-append"><a class="btn btn-info text-white">%</a></span></div></div></div><div class="col-sm-6"><label> </label><div class="form-check form-check-flat mt-0"><input name="NotNA" type="checkbox" class="form-check-input"/> N/A</div> </div><div class="col-sm-12"> <div class="form-group"><a href="javascript:;" class="btn btn-success col-12" data-type="ADQ" data-index="'+QuestionIndex+'" data-parent="'+Parent+'"><i class="fa fa-plus"></i> Add Question </a></div></div></div></form>'
});
$('body').on('click','a[data-type=ADQ]',function(){
var Data = {
'Question' : $('input[name=Title]').val(),
'Role' : $('select[name=Role]').val(),
'Weight' : $('input[name=Weight]').val(),
'NotNa' : $('input[name=NotNA]').prop("checked") ? 1 : 0,
'Options' : {},
'Parent' : $(this).attr('data-parent')
};
// Pushing Data to Object
Question[QuestionIndex] = Data;
// Increasing Index
console.log('Before increasing QuestionIndex: ' + QuestionIndex);
QuestionIndex++;
console.log('After increasing QuestionIndex: ' + QuestionIndex);
// Finding Entry Index
var Index = parseInt(Object.keys(Question).length);
console.log('Before Index of Question: ' + Index);
// Defining Title
var QuestionTitle = Question[Index].Question;
// HTML
var HTML = '<div class="mb-3" data-type="QRow" data-index="'+Index+'"> <div class="card border-success rounded"> <div class="card-header"> <div class="row"> <div class="col-sm-8 pt-1">'+QuestionTitle+'</div> <div class="col-sm-4 text-right"><a href="javascript:;" class="btn btn-info mr-1" data-type="OPO" data-parent="'+Index+'"><i class="fa fa-plus"></i> Add Option</a><a href="javascript:;" class="btn btn-danger" data-type="RQ" data-index="'+Index+'"><i class="fa fa-close"></i></a></div> </div> </div> <div class="card-body bg-light" data-type="OUNQ" data-parent="'+Index+'"></div> </div></div>';
// Appending Question
switch(Question[Object.keys(Question).length].Parent){
case "null":
// Append Question
$('[data-type=Questions]').append(HTML);
$('.avgrund-close').click();
console.log('After Index of Question: ' + Index);
break;
default:
// Append Question
$('[data-type=QUNO][data-parent='+Parent+']').append(HTML);
$('.avgrund-close').click();
console.log('After Index of Question: ' + Index);
}
});
},
CreateOption: function(){
var Parent = parseInt($(this).attr('data-parent'));
Parent = isNaN(Parent) ? null : Parent;
Model = $(this).avgrund({
height: 500,
holderClass: 'custom',
closeByEscape: true,
closeByDocument: true,
showClose: true,
showCloseText: 'x',
onBlurContainer: '.container-scroller',
template: '<form name="AddOption"> <div class="row"> <div class="col-sm-12"> <div class="form-group"> <label>Name</label> <input type="text" class="form-control" name="Name"> </div> </div> <div class="col-sm-12"> <div class="form-group"> <label>Type</label> <select name="Type" class="form-control"> <option value="checkbox">Checkbox</option> <option value="radio">Radio</option> </select> </div> </div> <div class="col-sm-6"> <div class="form-group"> <label>Effect</label> <input type="text" class="form-control" name="Effect"> </div> </div> <div class="col-sm-6"> <div class="form-group"> <label>Point</label> <input type="text" class="form-control" name="Point"> </div> </div> <div class="col-sm-12"> <div class="form-check form-check-flat mt-0"> <input name="FatalError" type="checkbox" class="form-check-input"> FatalError</div> </div> <div class="col-sm-12"> <div class="form-group"><a href="javascript:;" class="btn btn-success col-12" data-type="ADO" data-index="'+OptionIndex+'" data-parent="'+Parent+'"><i class="fa fa-plus"></i> Add Option </a></div> </div> </div></form>'
});
$('body').on('click','a[data-type=ADO]',function(){
var Data = {
'Option' : $('input[name=Name]').val(),
'Type' : $('select[name=Type]').val(),
'Effect' : $('input[name=Effect]').val(),
'Point' : $('input[name=Point]').val(),
'FatalError' : $('input[name=FatalError]').prop("checked") ? 1 : 0,
'Parent' : $(this).attr('data-parent')
};
// Pushing Data to Object
Question[Parent].Options[OptionIndex] = Data;
// Increasing Index
console.log('Getting OptionIndex before increasing' + OptionIndex);
OptionIndex++;
console.log('Getting OptionIndex after increasing' + OptionIndex);
console.log('Parent Index using for Question' + Index);
var Options = Question[Parent].Options;
// Appending Option
var Index = parseInt(Object.keys(Options).length);
console.log('Getting Option Index' + Index);
var Name = '';
//var Name = Options[Index].Option;
//console.log('Getting Option Name' + Options[Index].Option);
// Creating Option HTML
var HTML = '<div class="mb-3" data-type="ORow" data-index="'+Index+'"> <div class="card border-success rounded"> <div class="card-header"> <div class="row"> <div class="col-sm-8 pt-1">'+Name+'</div> <div class="col-sm-4 text-right"> <a href="javascript:;" class="btn btn-success mr-1" data-type="OQ" data-parent="'+Index+'"><i class="fa fa-plus"></i> Add Question</a><a href="javascript:;" class="btn btn-danger" data-type="RO" data-index="'+Index+'" data-parent="'+Parent+'"><i class="fa fa-close"></i></a></div> </div> </div> <div class="card-body bg-light" data-type="QUNO" data-parent="'+Index+'"></div> </div></div>';
// Append Question
$('[data-type=OUNQ][data-parent='+Parent+']').append(HTML);
$('.avgrund-close').click();
});
}
});
答案 0 :(得分：0)
您可以尝试使用取消绑定和绑定点击功能
$('body').unbind('click).bind('click','a[data-type=ADQ]',function(){
});