首先发送ajax请求,接收到后端传来的json数据
admin.get({
url: "/wx/pgtj/getQuestionByQuestionnaireId/1507284304819191810",
data: $("#baseClassId").val(),
done: function (data) {
//班级基本信息
$("#className").val(data.data.className);
$("#classStartTime").val(data.data.classStartTime);
$("#classEndTime").val(data.data.classEndTime);
var list = data.data.normalList;
var str="";
var button="";
debugger
for (const element of list) {
var oText = document.getElementById("element.questionName");
console.log("oText",oText)
var ss = element.pgTjOptionQueryVoList;
if (element.questionType == 0){
str += ("<label class=\"layui-form-label-1\" style=\"webkit-appearance: none\">"+element.questionName+"</label><br>");
for (const dicSelectElement of ss) {
str+=("<input type=\"radio\" name=\"satisfy\" id=\""+dicSelectElement.id+"\" value=\""+dicSelectElement.optionName+"\" " +
" title=\""+dicSelectElement.optionName+"\" checked=\"\" " +
"style=\"margin-top: 10px\"><div class=\"layui-jxcp-pjxx-body-danxuan\">"+dicSelectElement.optionName+"</div><br>");
}
}else if (element.questionName == "您的建议:"){
str+=(" <div class=\"layui-jxcp-pjxx-body-jianyi layui-form-label-1\">"+element.questionName+"</div>\n" +
" <input class=\"layui-jxcp-pjxx-body-input layui-form-label-1\" name=\"oneYj\" id=\""+element.id+"\"><br><br>");
}else if (element.questionType == 1){
str+=("<label class=\"layui-form-label-1\" style=\"webkit-appearance: none\">"+element.questionName+"</label><br>");
for (const tableElement of ss) {
str+=(" <input type=\"checkbox\" name=\""+tableElement.optionName+"\" title=\""+tableElement.optionName+"\">" +
"<div style='margin-left: 20px;margin-top: -15px'>"+tableElement.optionName+"</div><br>");
}
}else if (element.questionType == 2 && element.questionName != "11、"
&& element.questionName != "本节课哪个观点或细节给您留下深刻印象:"){
str+=("<label class=\"layui-form-label-1\" style=\"webkit-appearance: none\">"+element.questionName+"</label><br><br>");
debugger
if (element.pgTjOptionQueryVoList.length == 0){
str+=("<textarea style=\"width: 350px;height: 70px;\" name=\"thirteenText\" id=\"thirteenText\"></textarea><br><br>");
}else{
for (const s of element.pgTjOptionQueryVoList) {
str+=("<textarea style=\"width: 350px;height: 70px;\" name=\"thirteenText\" id=\"thirteenText\"></textarea><br><br>");
}
}
}else if (element.questionName == "11、请您对本次"){
str+=("<label class=\"layui-form-label-1\" style=\"webkit-appearance: none\">"+element.questionName+"</label><br><br>");
}else if (element.questionName == "本节课哪个观点或细节给您留下深刻印象:"){
str+=("<label class=\"layui-form-label-1\" style=\"webkit-appearance: none\">"+element.questionName+"</label><br><br>");
}
document.getElementById("oneXz").innerHTML=str;
}
button+=("<button class=\"layui-btn layui-btn-sm layuiadmin-btn-list\" style=\"margin-top: 10px\">提交</button>");
console.log(button)
document.getElementById("buttonXz").innerHTML=button;
/* var str;
var a=0;
for (const layerElement of ss) {
a++;
str+=("<div style=\"position:absolute;margin-top: 20px\">"+layerElement+"</div><br>\n" +
" <div class=\"layui-input-block layui-form-label-1\" style=\"margin-left: 25px;margin-top: 20px\" name=\"threeXz"+a+"\" id=\"threeXz"+a+"\">\n" +
" <input type=\"radio\" name=\"satisfy\" value=\"满意\" title=\"满意\" checked=\"\" style=\"margin-top: 9px\"><div class=\"layui-jxcp-pjxx-body-danxuan\">满意</div><br>\n" +
" <input type=\"radio\" name=\"satisfy\" value=\"较满意\" title=\"较满意\" style=\"margin-top: 5px\"><div class=\"layui-jxcp-pjxx-body-danxuan\">较满意</div><br>\n" +
" <input type=\"radio\" name=\"satisfy\" value=\"不满意\" title=\"不满意\" style=\"margin-top: 5px\"><div class=\"layui-jxcp-pjxx-body-danxuan\">不满意</div><br>\n" +
" </div>")
}
document.getElementById("threeDt").innerHTML=str;*/
}
});
拿到回调函数里面的date就是咱们需要的json数据
例如:
var data={
"code": 200,
"msg": "操作成功",
"success": true,
"data": {
"className": "测试班级",
"classStartTime": "2022-03-16",
"classEndTime": "2022-04-18",
"assessName": "关于测试班级评估",
"courseName": null,
"teacherName": null,
"way": null,
"caption": null,
"courseDate": null,
"politicalList": [],
"normalList": [
{
"id": "1506840895252549633",
"questionnaireId": "1506840525168136193",
"questionName": "1、培训日程安排",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840964257239042",
"questionId": "1506840895252549633",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840964278210562",
"questionId": "1506840895252549633",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840964278210563",
"questionId": "1506840895252549633",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840964341125122",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840964412428290",
"questionnaireId": "1506840525168136193",
"questionName": "2、现场教学、情景教学等各类课程的设置情况",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840964450177026",
"questionId": "1506840964412428290",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840964462759938",
"questionId": "1506840964412428290",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840964462759939",
"questionId": "1506840964412428290",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840964529868801",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840964592783361",
"questionnaireId": "1506840525168136193",
"questionName": "3、专题的总体评价",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840964659892226",
"questionnaireId": "1506840525168136193",
"questionName": "《文明思想》",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840964701835265",
"questionId": "1506840964659892226",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840964718612482",
"questionId": "1506840964659892226",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840964718612483",
"questionId": "1506840964659892226",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840964781527041",
"questionnaireId": "1506840525168136193",
"questionName": "《坚守初心使命》",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840964810887169",
"questionId": "1506840964781527041",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840964827664386",
"questionId": "1506840964781527041",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840964836052994",
"questionId": "1506840964781527041",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840964894773249",
"questionnaireId": "1506840525168136193",
"questionName": "《集体形成史》",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840964936716290",
"questionId": "1506840964894773249",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840964945104897",
"questionId": "1506840964894773249",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840964945104898",
"questionId": "1506840964894773249",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965016408065",
"questionnaireId": "1506840525168136193",
"questionName": "4、教师教学设施、学员公寓设施配备及服务情况:",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840965058351105",
"questionId": "1506840965016408065",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840965070934017",
"questionId": "1506840965016408065",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840965070934018",
"questionId": "1506840965016408065",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965133848577",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965205151746",
"questionnaireId": "1506840525168136193",
"questionName": "5、带班老师服务情况",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840965259677698",
"questionId": "1506840965205151746",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840965263872001",
"questionId": "1506840965205151746",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840965263872002",
"questionId": "1506840965205151746",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965305815041",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965351952386",
"questionnaireId": "1506840525168136193",
"questionName": "6、求知书社、学员超市及健身中心建设情况:",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840965381312514",
"questionId": "1506840965351952386",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840965389701122",
"questionId": "1506840965351952386",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840965389701123",
"questionId": "1506840965351952386",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965423255554",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965473587201",
"questionnaireId": "1506840525168136193",
"questionName": "7、学苑餐厅菜品种类、品质及服务情况:",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840965502947330",
"questionId": "1506840965473587201",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840965511335938",
"questionId": "1506840965473587201",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840965511335939",
"questionId": "1506840965473587201",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965553278978",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965603610626",
"questionnaireId": "1506840525168136193",
"questionName": "8、学院学习生活环境和氛围:",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840965632970753",
"questionId": "1506840965603610626",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840965641359361",
"questionId": "1506840965603610626",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840965641359362",
"questionId": "1506840965603610626",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965683302402",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965729439745",
"questionnaireId": "1506840525168136193",
"questionName": "9、您对本次培训的总体评价:",
"isRequired": 1,
"option": null,
"questionType": 0,
"pgTjOptionQueryVoList": [
{
"id": "1506840965754605569",
"questionId": "1506840965729439745",
"optionName": "满意",
"sort": 1
},
{
"id": "1506840965762994178",
"questionId": "1506840965729439745",
"optionName": "较满意",
"sort": 2
},
{
"id": "1506840965762994179",
"questionId": "1506840965729439745",
"optionName": "不满意",
"sort": 3
}
]
},
{
"id": "1506840965800742913",
"questionnaireId": "1506840525168136193",
"questionName": "您的建议:",
"isRequired": 1,
"option": null,
"questionType": null,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965851074561",
"questionnaireId": "1506840525168136193",
"questionName": "10、本次培训、您印象最深的课程有哪些,按课程形式勾选,可多选或不选(在内打“√”):",
"isRequired": 1,
"option": null,
"questionType": 1,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840965893017602",
"questionnaireId": "1506840525168136193",
"questionName": "现场教学:",
"isRequired": 1,
"option": null,
"questionType": 1,
"pgTjOptionQueryVoList": [
{
"id": "1506840965918183426",
"questionId": "1506840965893017602",
"optionName": "《杰出楷模》专题展",
"sort": 1
},
{
"id": "1506840965926572034",
"questionId": "1506840965893017602",
"optionName": "教学点",
"sort": 2
},
{
"id": "1506840965926572035",
"questionId": "1506840965893017602",
"optionName": "教学点",
"sort": 3
},
{
"id": "1506840965926572036",
"questionId": "1506840965893017602",
"optionName": "同年读书旧址教学点",
"sort": 4
}
]
},
{
"id": "1506840965972709377",
"questionnaireId": "1506840525168136193",
"questionName": "音像教学:",
"isRequired": 1,
"option": null,
"questionType": 1,
"pgTjOptionQueryVoList": [
{
"id": "1506840965993680898",
"questionId": "1506840965972709377",
"optionName": "《榜样》",
"sort": 1
}
]
},
{
"id": "1506840966044012546",
"questionnaireId": "1506840525168136193",
"questionName": "情景教学:",
"isRequired": 1,
"option": null,
"questionType": 1,
"pgTjOptionQueryVoList": [
{
"id": "1506840966069178370",
"questionId": "1506840966044012546",
"optionName": "”你是这样的人“——精神风范情景报告会",
"sort": 1
}
]
},
{
"id": "1506840966115315714",
"questionnaireId": "1506840525168136193",
"questionName": "专题讲座:",
"isRequired": 1,
"option": null,
"questionType": 1,
"pgTjOptionQueryVoList": [
{
"id": "1506840966140481537",
"questionId": "1506840966115315714",
"optionName": "《生态文明思想》",
"sort": 1
},
{
"id": "1506840966148870146",
"questionId": "1506840966115315714",
"optionName": "《坚守初心使命》",
"sort": 2
},
{
"id": "1506840966148870147",
"questionId": "1506840966115315714",
"optionName": "《集体成史》",
"sort": 3
}
]
},
{
"id": "1506840966186618882",
"questionnaireId": "1506840525168136193",
"questionName": "情感教学:",
"isRequired": 1,
"option": null,
"questionType": 1,
"pgTjOptionQueryVoList": [
{
"id": "1506840966215979010",
"questionId": "1506840966186618882",
"optionName": "《经典回响 感悟恩来精神》",
"sort": 1
}
]
},
{
"id": "1506840966257922049",
"questionnaireId": "1506840525168136193",
"questionName": "11、请您对本次专题讲座进行评估",
"isRequired": 1,
"option": null,
"questionType": 2,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840966304059393",
"questionnaireId": "1506840525168136193",
"questionName": "本节课哪个观点或细节给您留下深刻印象:",
"isRequired": 1,
"option": null,
"questionType": 2,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840966337613825",
"questionnaireId": "150840525168136193",
"questionName": "《生态文明思想》",
"isRequired": 1,
"option": null,
"questionType": 2,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840966375362562",
"questionnaireId": "1506840525168136193",
"questionName": "《坚守初心使命》",
"isRequired": 1,
"option": null,
"questionType": 2,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840966408916994",
"questionnaireId": "1506840525168136193",
"questionName": "12、您在学院还想听到哪方面的课程",
"isRequired": 1,
"option": null,
"questionType": 2,
"pgTjOptionQueryVoList": []
},
{
"id": "1506840966446665729",
"questionnaireId": "1506840525168136193",
"questionName": "13、在您的支持和参与下,本次培训即将圆满结束。请留下您的意见和建议,谢谢!",
"isRequired": 1,
"option": null,
"questionType": 2,
"pgTjOptionQueryVoList": []
}
]
},
"time": "2022-03-24 15:46:20"
};
利用for循环对就送数据进行遍历,动态生成单选,多选,输入框等标签.
动态生成代码,将标签字符串存储到str字符串里面.
document.getElementById("LAY-select-classId").innerHTML=str;用于生成str语句中的内容
var str="";
var a=0;
for (const argument of classInfo) {
a++;
/* str+=('<input class="layui-btn layui-btn-sm layuiadmin-btn-list" type="button" ' +
'style="margin-top:25px;text-align: center;height:30px;width:250px;color: #E7F6F4" ' +
'name="'+"className"+a+'" id="'+"className"+a+'" value="'+argument.name+'" ><br>')*/
str+=('<a href=\'javascript:void(0)\' style="color:#0d87ea;" id='+"className"+a+'>'+argument.name+'</a><br><br>')
}