zoukankan      html  css  js  c++  java
  • springboot中使用templates 根据选择树结构id 动态查询 数据 并赋值到input中

    需求  动态根据选择的题库id 查询题库数量 动态赋值给input 限制出题数量

    # 树结构数据展示题库

    <div class="form-group">
         <label class="col-sm-3 control-label">题型:</label>
         <div class="col-sm-8">
           <input name="questionName" onclick="selectTree()" id="treeName" type="text" placeholder="请选择题型" class="form-control" required autocomplete="off">
         </div>
    </div>

    #需要赋值的input框

    <div class="form-group">
            <label class="col-sm-3 control-label">单选题数量:</label>
            <div class="col-sm-8">
              <input name="singleChoiceNum" class="form-control" type="number" min = 0 autocomplete="off" id="singleChoiceNum">
            </div>
    </div>
    <div class="form-group">
           <label class="col-sm-3 control-label">多选题数量:</label>
           <div class="col-sm-8">
             <input name="multipleChoiceNum" class="form-control" type="number" min = 0 autocomplete="off" id="multipleChoiceNum">
           </div>
    </div>

    #获取树结构数据信息

    function selectTree() {
                var treeId = $("#treeId").val();
                var questionType = $.common.isEmpty(treeId) ? "100" : $("#treeId").val();
                var url = ctx + "exam/question/selectQuestionTree/" + questionType;
                var options = {
                    title: '选择题型',
                     "380",
                    url: url,
                    callBack: doSubmit
                };
                $.modal.openOptions(options);
            }
            function doSubmit(index, layero){
                var tree = layero.find("iframe")[0].contentWindow.$._tree;
                if ($.tree.notAllowParents(tree)) {
                    var body = layer.getChildFrame('body', index);
                    $("#treeId").val(body.find('#treeId').val());
                    $("#treeName").val(body.find('#treeName').val());
                    var questionType = $("input[name='questionType']").val();
              #根据选择的树结构数据,进行异步查询题库单选多选数量
    if(questionType != ''){ $.ajax({ //请求方式 type : "POST", //请求的媒体类型 contentType: "application/json;charset=UTF-8", //请求地址 url : ctx + "exam/question/findQuestionSum/?questionType="+questionType, //请求成功 success : function(result) {                  #根据后台查询单选题数量进行赋值 document.getElementById('singleChoiceNum').max = result.examQuestionType.singleChoiceSum;
                     #根据后台查询多选题数量进行赋值 document.getElementById(
    'multipleChoiceNum').max = result.examQuestionType.multipleChoiceSum; }, //请求失败,包含具体的错误信息 error : function(e){ console.log(e.status); console.log(e.responseText); } }); } layer.close(index); } }

     #后台代码

    @PostMapping("/findQuestionSum")
        @ResponseBody
        public Map<String,Object> findQuestionSum(ExamQuestionType examQuestionType) {
    
            examQuestionType.setSum1("0");
            ExamQuestionType findsingleChoiceSum = examQuestionTypeService.findsingleChoiceSum(examQuestionType);
            examQuestionType.setSum1("1");
            ExamQuestionType findmultipleChoiceSum = examQuestionTypeService.findsingleChoiceSum(examQuestionType);
    
            examQuestionType.setSingleChoiceSum(findsingleChoiceSum.getSum1());
            examQuestionType.setMultipleChoiceSum(findmultipleChoiceSum.getSum1());
            Map<String,Object> map = new HashMap<String,Object>();
            map.put("examQuestionType",examQuestionType);
    
    
            return map;
        }
  • 相关阅读:
    过滤器
    包装 request Demo
    分页思路
    导出数据库中所有数据到Excle中
    负载均衡集群中的session解决方案
    python 自动化之路 day 01 人生若只如初见
    python 自动化之路 day 00 目录
    切割TOMCAT日志
    Java进程CPU使用率高排查
    使用socket方式连接Nginx优化php-fpm性能
  • 原文地址:https://www.cnblogs.com/yypr/p/14324606.html
Copyright © 2011-2022 走看看