Helius
2022-05-27 4351e71d782741143a98f86f6648acd16689165f
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!-- 本框架基本脚本和样式 -->
    <script type="text/javascript"
            th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script>
</head>
<body>
<div class="ibox-content">
    <form class="form-horizontal" id="dataform"
          onsubmit="javascripr:return false;">
 
        <input autocomplete="off"   type="hidden" name="id" th:value="${obj?.id}">
 
        <div class="form-group">
 
            <label class="col-sm-2 control-label">字段分类<span class="text-danger">*</span></label>
            <div class="col-sm-4 ">
                <select name="category" class=" select2 form-control autoFull" id="category" dataType="*"
                        th:data-url="@{/admin/dataDictionary/showDataDictionary}"
                        data-filed="name"
                        data-value="name"
                        data-param="{type:'字段分类'}"
                        th:data-def="${obj?.category }"
                >
                    <option value="">--请选择字段分类--</option>
                </select>
            </div>
 
            <label class="col-sm-2 control-label">字段类型<span class="text-danger">*</span></label>
            <div class="col-sm-4 ">
                <select name="type" class=" select2 form-control autoFull" id="type" dataType="*"
                        th:data-url="@{/admin/dataDictionary/showDataDictionary}"
                        data-filed="name"
                        data-value="name"
                        data-param="{type:'问卷类型'}"
                        th:data-def="${obj?.type }"
                >
                    <option value="">--请选择字段类型--</option>
                </select>
            </div>
        </div>
 
        <div class="form-group">
            <label class="col-sm-2 control-label">标题<span class="text-danger">*</span></label>
            <div class="col-sm-4">
                <input autocomplete="off"   name="question" type="text" class="form-control" dataType="*1-50" th:value="${obj?.question }" >
            </div>
            <label class="col-sm-2 control-label">排序<span class="text-danger">*</span></label>
            <div class="col-sm-4">
                <input autocomplete="off"   name="orderField" type="number" class="form-control" dataType="n1-6" th:value="${obj?.orderField }" >
            </div>
        </div>
 
        <div id="selectAnswers">
            <div class="form-group">
                <label class="col-sm-2 control-label">选项</label>
                <div class="col-sm-1">
                    <input autocomplete="off"   type="button" value="新增选项" class="btn btn-success radius" onclick="addAnswer()"/>
                </div>
            </div>
            <div th:if="${obj} ne null " >
                <div class="form-group" th:each="item,str:${obj?.answers}"  th:id="'answer'+${str.index}">
                    <label class="col-sm-2 control-label">选项</label>
                    <div class="col-sm-4">
                        <input autocomplete="off"   th:name="'answers['+${str.index}+'].id'"  type="hidden" th:value="${item.id }" class="form-control" >
                        <input autocomplete="off"   th:name="'answers['+${str.index}+'].answer'" dataType="*1-100" type="text" th:value="${item.answer }" class="form-control" >
                    </div>
                    <label class="col-sm-2 control-label">排序</label>
                    <div class="col-sm-2">
                        <input autocomplete="off"   th:name="'answers['+${str.index}+'].orderField'" dataType="n1-6" th:value="${item.orderField }" type="number" class="form-control" >
                    </div>
                    <div class="col-sm-2">
                        <input autocomplete="off"   value="删除" type="button" class="btn btn-danger radius" th:onclick="'delAnswer(\'#answer'+${str.index}+'\')'">
                    </div>
                </div>
            </div>
 
        </div>
            <div class="form-group ">
                <div class="col-sm-12 text-center fixed-button">
                    <a href="javascript:;" onclick="myForm.submit()"
                       class="btn btn-success radius"><i class="fa fa-check"></i> 保存</a>&nbsp;&nbsp;&nbsp;&nbsp;
                    <a class="btn btn-danger radius" href="javascript:;"
                       onclick="MTools.closeForm()"><i class="fa fa-close"></i> 关闭</a>
                </div>
            </div>
        </div>
    </form>
<div id="modDiv" style="display: none;">
    <div class="form-group" id="answer_index">
        <label class="col-sm-2 control-label">选项</label>
        <div class="col-sm-4">
            <input autocomplete="off"   name="answers[_index].answer" type="text" class="form-control" >
        </div>
        <label class="col-sm-2 control-label">排序</label>
        <div class="col-sm-2">
            <input autocomplete="off"   name="answers[_index].orderField" type="number" class="form-control" >
        </div>
        <div class="col-sm-2">
            <input autocomplete="off"   value="删除" type="button" class="btn btn-danger radius" onclick="delAnswer('#answer_index')">
        </div>
    </div>
</div>
</div>
</body>
 
 
<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script>
<script th:inline="javascript">
 
 
    /*<![CDATA[*/
    var answerSize=/*[[${answerSize}]]*/
    /*]]>*/
 
    $(".select2").select2();
    MTools.autoFullSelect();
    var myForm=MForm.initForm({
        invokeUrl:basePath+"/admin/question/addOrModify",
        afterSubmit:function(){
            parent.myGrid.serchData();
        },
    });
 
    function addAnswer(){
        console.log($("#modDiv").html());
        var html=$("#modDiv").html().replace(new RegExp('_index','g'), answerSize);
        console.log(html);
        $("#selectAnswers").append(html);
        answerSize+=1;
 
    }
    function delAnswer(id){
        $(id).remove();
    }
</script>
</body>
</html>