EL-使用EL实现问卷调查

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

用户输入昵称、所在城市,并且以多选的方式让用户选择所使用的开发语言,然后使用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>
    
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->


  </head>
  
  <body>
  <form action="ELshow.jsp">
    <table>
    
    <tr>
    <td>昵称:</td>
    <td><input type="text"name="name"></td>
    </tr>
    <tr>
    <td>所在城市:</td>
    <td><input type="text"name="city"></td>
    </tr>
    <tr>
    <td>您所使用的语言是:</td>
    <td><input type="checkbox"name="language"value="java">java</td>
    <td><input type="checkbox"name="language"value="C">C</td>
    <td><input type="checkbox"name="language"value="C++">C++</td>
    <td><input type="checkbox"name="language"value="PHP">PHP</td>
    <td><input type="checkbox"name="language"value="ASP">ASP</td>
    </tr>
    <tr>
    <td><input type="submit"value="提交"></td>
    </tr>
    </table>
    </form>
  </body>
</html>

显示页面:

<%@ 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 'ELshow.jsp' starting page</title>
    
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->


  </head>
  
  <body>
  您填写的内容是:<br>
  昵称:${param.name }<br>
  所在城市:${param.city }<br>
  使用的开发语言有:${paramValues.language[0] } ${paramValues.language[1] }
  ${paramValues.language[2] }${paramValues.language[3] }
  ${paramValues.language[4] }
  </body>
</html>

``` <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、付费专栏及课程。

余额充值