jeecg-boot 表单选择一条数据保存

news/2025/1/14 13:38:36/

 HTML(新增form)

<a-col :span="24"><a-form-item label="专题学习表名称" :labelCol="labelCol" :wrapperCol="wrapperCol"><!-- <a-input v-decorator="['studyName', validatorRules.studyName]" placeholder="请输入专题学习表名称"></a-input> --><share-basic-info-select-list placeholder="请选择专题学习表" v-decorator="['studyName', validatorRules.studyName]" @select="selectContentOK" ref="modalForm" /></a-form-item></a-col>

引用

import ShareBasicInfoSelectList from "./ShareBasicInfoSelectList.vue"components: {ShareBasicInfoSelectList,},

submitForm中要添加(实体有studyId,studyName字段)

if(this.model.studyName != null){formData.studyId = this.studyId}else{alert("专题学习为空!");that.confirmLoading = false;return null;}

方法

// 专题学习信息selectContentOK(row) {let studyId = null;let studyName = null;if  (row.length > 0){for (let i = 0, len = row.length; i < len; i++) {studyId = row[i]['id'];studyName = row[i]['name'];}this.$nextTick(() => {this.form.setFieldsValue({'studyId': studyId,'studyName': studyName,});})this.studyId = studyId}else{this.form.setFieldsValue({'studyId': studyId,'studyName': studyName,});this.studyId = studyId}},

ShareBasicInfoSelectList页面

<template><j-select-biz-component:value="value"name="专题学习"displayKey="name":returnKeys="returnKeys":listUrl="url.list":columns="columns"queryParamText="专题学习名称"queryParamCode="name":multiple="multiple"v-on="$listeners"v-bind="$attrs":width="1200":ellipsisLength="20"/>
</template><script>import JSelectBizComponent from '@/components/jeecgbiz/JSelectBizComponent'export default {name: 'ShareBasicInfoSelectList',components: { JSelectBizComponent },props: ['value'],data() {return {multiple:false,returnKeys: ['id','id'],url: { list: '/xxx/xxxStudyInfo/list' },columns: [{ title: '专题学习名称', dataIndex: 'name', align: 'center', width: '50%' },{ title: '教育资源类型', dataIndex: 'type_dictText', align: 'center', width: '50%' }],}}}
</script><style lang="less" scoped></style>

url放后端你想要的列表接口即可


http://www.ppmy.cn/news/1563040.html

相关文章

查看nginx已安装的模块

一、查看nginx已经安装了哪些模块 1、使用nginx -V [rootjxq-c2-16-1 auto]# /alidata/nginx/sbin/nginx -V nginx version: nginx/1.11.13 built by gcc 4.4.7 20120313 (Red Hat 4.4.7-17) (GCC) built with OpenSSL 1.0.1e-fips 11 Feb 2013 TLS SNI support enabled conf…

ImagePicker操作多张图片

文章目录 1. 概念介绍2. 方法与细节2.1 实现方法2.2 具体细节3. 示例代码4. 内容总结我们在上一章回中介绍了"如何选择单个图片文件"相关的内容,本章回中将介绍如何选择多个图片文件.闲话休提,让我们一起Talk Flutter吧。 1. 概念介绍 我们在上一章回中介绍了如何…

基于大语言模型的组合优化

摘要&#xff1a;组合优化&#xff08;Combinatorial Optimization, CO&#xff09;对于提高工程应用的效率和性能至关重要。随着问题规模的增大和依赖关系的复杂化&#xff0c;找到最优解变得极具挑战性。在处理现实世界的工程问题时&#xff0c;基于纯数学推理的算法存在局限…

关于Java状态模式的面试题及其答案

Java中有23种设计模式&#xff0c;主要分为三类&#xff1a;创建型模式、结构型模式和行为型模式‌。 创建型模式 创建型模式关注于对象的创建&#xff0c;提供了更灵活的对象创建方式。主要包括以下几种&#xff1a; ‌单例模式‌&#xff1a;确保一个类只有一个实例&#…

Scala分布式语言二(基础功能搭建、面向对象基础、面向对象高级、异常、集合)

章节3基础功能搭建 46.函数作为值三 package cn . itbaizhan . chapter03 // 函数作为值&#xff0c;函数也是个对象 object FunctionToTypeValue { def main ( args : Array [ String ]): Unit { //Student stu new Student() /*val a ()>{"GTJin"…

性能测试工具Jmeter中的FTP脚本开发

FTP文件传输协议是TCP/IP协议组织中的常用协议之一&#xff0c;主要用在internet上双向传输文件。FTP协议具有客户端和服务器端两个部分组成部分&#xff0c;具有上传与下载两种功能。Jmeter也提供了FTP请求的测试支持&#xff0c;实现了上传和下载功能测试。 对于上图的FTP请求…

穿越火线怀旧服预约网页vue3版本

源码下载地址: https://github.com/superBiuBiuMan/crossfire-old-vue3版权来自穿越火线,项目仅供参考学习!!! 效果 源码下载地址: https://github.com/superBiuBiuMan/crossfire-old-vue3预览地址: https://crossfire.123916.xyz/官网效果: https://www.cfhuodong.com/2025-…

20250110面试鸭特训营第18天

更多特训营笔记详见个人主页【面试鸭特训营】专栏 250110 1. 常见的 HTTP 状态码有哪些&#xff1f; 状态码由三位数组组成&#xff0c;且第一位数字表示类别常见的 HTTP 状态码分为五大类 1xx&#xff1a;信息响应 状态码标识含义100Continue服务器已接收请求的初步部分&a…