EL-使用EL实现问卷调查

这篇博客介绍了一个使用EL(Expression Language)来实现的简单问卷调查。用户在表单中输入昵称、所在城市,并通过多选框选择所使用的开发语言。提交后,EL表达式用于在页面上显示用户的输入信息,包括昵称、城市以及选择的开发语言。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

用户输入昵称、所在城市,并且以多选的方式让用户选择所使用的开发语言,然后使用EL表达式显示在页面上

问卷调查页面:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%


 %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>My JSP 'ELenter.jsp' starting page</title>
    

``` <div v-for="(question, index) in questions" :key="index"> <!----> <el-form-item v-if="question.question_type === 1" :label="question.question_text" :prop="`${question.question_code}`" :rules="[ { required: true, message: '请选择', trigger: 'change'} ]"> <el-radio-group v-model="formData[question.question_code]" :disabled='isUpdate'> <el-radio v-for="option in question.options" :key="option.option_code" :value="option.option_code">{{ option.option_text }}</el-radio> </el-radio-group> </el-form-item> <!----> <el-form-item v-else-if="question.question_type === 2" :label="question.question_text" :prop="`${question.question_code}`" :rules="[ { type: 'array', required: true, message: '请至少选择一项', trigger: 'change'} ]"> <el-checkbox-group v-model="formData[question.question_code]" :disabled='isUpdate'> <el-checkbox v-for="option in question.options" :key="option.option_code" :value="option.option_code">{{ option.option_text }}</el-checkbox> </el-checkbox-group> </el-form-item> </div> <el-form ref="formRefs" :model="info" :rules="rules" label-width="80px" @submit.prevent=""> <el-row :gutter="16"> <el-col :span="6"> <el-form-item label="姓名" prop="name"> <el-input clearable v-model="info.name" :disabled='isUpdate' /> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="性别" prop="gender"> <el-input clearable v-model="info.gender" :disabled='isUpdate' /> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="年龄" prop="age"> <el-input clearable v-model="info.age" :disabled='isUpdate' /> </el-form-item> </el-col> </el-row> <el-row :gutter="16"> <el-col :span="10"> <el-form-item label="身份证号" prop="id_no"> <el-input clearable maxlength="18" v-model="info.id_no" :disabled='isUpdate' /> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="联系方式" prop="phone_no"> <el-input clearable maxlength="11" v-model="info.phone_no" :disabled='isUpdate' /> </el-form-item> </el-col> <el-col :span="6"> <el-form-item label="调查方式" prop="visit_type"> <el-radio-group v-model="info.visit_type" :disabled='isUpdate'> <el-radio value="自助" label="自助" /> <el-radio value="电话" label="电话" /> <el-radio value="微信" label="微信" /> </el-radio-group> </el-form-item> </el-col> </el-row> </el-form>```vue3如何实现一个提交按钮校验两个el-form 表单
03-08
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值