AbuCoder 2023-02-28 18:48 采纳率: 50%
浏览 169
已结题

SpringBoot表单保存

如何把这个表单提交到后端,存储到数据库里,给改下,代码,谢谢!

img

下面是我的写法,但是我搞不定。只有把这个数据一起存储到数据库即可!!

<form class="form-horizontal m" id="form-overallevaluation-add">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h3>综合素质自评</h3>
                    </div>
                    <div class="ibox-content">
                        <table class="table">
                            <thead>
                            <tr>
                                <th scope="col" class="text-center" style="font-weight: bold;font-size: 18px;width: 100px;"><div class="alert alert-success" style="margin-bottom: 5px;">序号 </div></th>
                                <th scope="col" class="text-center" style="font-weight: bold;font-size: 18px;"><div class="alert alert-success " style="margin-bottom: 5px;">评价内容</div></th>
                                <th scope="col" class="text-center" style="font-weight: bold;font-size: 18px;width: 130px;"><div class="alert alert-success" style="margin-bottom: 5px;">学生自评</div></th>
                            </tr>
                            </thead>
                            <tr th:each="qitem,item:${qlist}">
                                <td class="text-center" scope="row"><div class="tdstyle alert  alert-info"><span th:text="${item.index+1}"></span></div></td>
                                <td><div class="tdstyle alert  alert-info "><span th:id="'question_'+${qitem.itemid}" th:text="${qitem.itemTitle}"></span></div></td>
                                <td><div class="tdstyle alert  alert-info">


                                    <select th:id="'question_'+${qitem.itemid}+'_option'"  name="selfAssessment" class="form-control m-b" th:with="type=${@dict.getType('system_rank')}">
                                        <option  th:attr="data-id=${qitem.itemid}" th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                                    </select>
                                </div></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        
<a class="btn btn-primary btn-rounded btn-block" href="javascript:void(0)" onclick="submitData()"><i class="fa fa-info-circle"></i> 提交</a> </form> let obj = $('#form-overallevaluation-add').serialize(); console.log(obj) $.post(prefix + "/submitOptions", obj, function(result) { console.log(result) if (result.code == web_status.SUCCESS) { $.modal.msgSuccess("提交成功") $.modal.close(); } else { $.modal.msgError(result.msg); } });
@PostMapping("/submitOptions")
    @ResponseBody
    public AjaxResult submitOptions(@RequestParam String semester,@RequestParam String options){
        System.out.println(semester);
        System.out.println(options);
        String[] selectoptions = options.split("&");
        for(int i = 0 ;i <= selectoptions.length -1;i++){
            String[] test = selectoptions[i].split("=");
            String qidstr = test[1].replace("\"", "");
            System.out.println(qidstr);
        }
        return AjaxResult.success();
    }

  • 写回答

4条回答 默认 最新

  • 社区专家-Monster-XH 2023-02-28 18:51
    关注

    基于Monster 组和GPT的调写:
    在前端将表单数据序列化成符合后端接口要求的参数格式,并使用 AJAX 发送 POST 请求到后端。

    以下是可能的修改代码示例:

    function submitData() {
        var formData = $('#form-overallevaluation-add').serialize();
        var semester = '2022-01'; // 替换为您要提交的学期信息
        $.ajax({
            type: "POST",
            url: prefix + "/submitOptions",
            data: {
                semester: semester,
                options: formData
            },
            success: function(result) {
                if (result.code == web_status.SUCCESS) {
                    $.modal.msgSuccess("提交成功");
                    $.modal.close();
                } else {
                    $.modal.msgError(result.msg);
                }
            }
        });
    }
    
    
    

    修改后的代码将 serialize() 方法返回的字符串作为参数 options 提交到后端,并且手动设置了学期参数 semester。后端接口的参数也做了相应的修改。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 3月9日
  • 已采纳回答 3月5日
  • 创建了问题 2月28日

悬赏问题

  • ¥20 数学建模来解决我这个问题
  • ¥15 计算机网络ip分片偏移量计算头部是-20还是-40呀
  • ¥15 stc15f2k60s2单片机关于流水灯,时钟,定时器,矩阵键盘等方面的综合问题
  • ¥15 YOLOv8已有一个初步的检测模型,想利用这个模型对新的图片进行自动标注,生成labellmg可以识别的数据,再手动修改。如何操作?
  • ¥30 NIRfast软件使用指导
  • ¥20 matlab仿真问题,求功率谱密度
  • ¥15 求micropython modbus-RTU 从机的代码或库?
  • ¥15 django5安装失败
  • ¥15 Java与Hbase相关问题
  • ¥15 后缀 crn 游戏文件提取资源