首页 > 开发 > JS > 正文

通过button将form表单的数据提交到action层的实例

2024-05-06 16:39:35
字体:
来源:转载
供稿:网友

form表单中不需要写action的路径,需要给form表单一个唯一的id,将你要提交的信息的表单中的标签name="action中的javabean对象.javabean属性"。给button按钮添加一个onclick()点击事件,并实现该点击事件,在该onclick()方法中通过ajax将form表单中的数据提交给action层

JSP页面中的代码:

   <form id="handleform">    <!-- 根据学生id修改学生信息 -->    <input type="hidden" name="student.stuid"/><!-- 隐藏学生id -->    <div class="input-group el_modellist" role="toolbar">     <span class="el_spans">要修改的班级:</span>     <select class="selectpicker form-control" name="student.className" id="fmchechunit"      <option value="0">--请选择班级--</option>      <option value="1">软件一班</option>      <option value="2">软件二班</option>     </select>    </div>    <span class="el_spans">学生姓名:</span>    <input type="text" id="student.name"/>     <div class="input-group el_modellist" role="toolbar">      <span class="el_spans">学生详细信息:</span>      <textarea id="studentMsg" class="form-control texta" rows="10" name="student.msg"></textarea>     </div>     <div class="modal-footer">      <button id="submitButton" onclick="saveButton()" type="button" class="btn btn-primary">更新</button>     </div>   </form>   <script type="text/javascript">    function saveButton(){      //通过ajax异步将数据发送给action层      $.ajax({       url : '${pageContext.request.contextPath}/stu/stu_upstudent.action',//这里写上你的action路径       data : $("#handleform").serialize(),//将你在form表单上提交的数据序列化       type : 'POST', //提交方式       dataType : 'json', //提交的数据类型       async:true, //是否异步       success : function(data) {//这是个回调函数 data表示从action中传过来的json数据       //弹出从action层传过来的json格式的数据(用来显示是否更新成功)       alert(data.result);       }      });    }   </script>

action层中的代码:

@Controller@Scope("prototype")// 控制层,多例模式public class DangerAction extends ActionSupport {  private Student student; public void setStudent(Student student){  this.student = student; } public Student getStudent(){  return this.student; }  @Resource private StudentService studentService; public StudentService getStudentService() {  return studentService; } public void setStudentService(StudentService studentService) {  this.studentService = studentService; } public String updateStudent throws Exception{    boolean flag = studentService.update(student);  HttpServletResponse response = ServletActionContext.getResponse();       //通过json对象将修改反馈信息响应给jsp  JSONObject json = new JSONObject();  if (flag) {   System.out.println(flag);   json.put("result", "修改成功");  } else {   System.out.println(flag);   json.put("result", "修改失败");  }  System.out.println(json.toString());  response.setContentType("text/html;charset=UTF-8");  response.getWriter().write(json.toString());  return null;//如果不需要跳转页面就写上null,如果要跳转页面就自己另外写上 }}

javabean代码:

public class Student{ private int stuid; private int className; private int name; private String studentMsg; public int getStuid() {  return stuid; } public void setStuid(int stuid) {  this.stuid = stuid; } public int getClassName() {  return className; } public void setClassName(int className) {  this.className = className; } public int getName() {  return name; } public void setName(int name) {  this.name = name; } public String getStudentMsg() {  return studentMsg; } public void setStudentMsg(String studentMsg) {  this.studentMsg = studentMsg; } }

以上这篇通过button将form表单的数据提交到action层的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持VeVb武林网。


注:相关教程知识阅读请移步到JavaScript/Ajax教程频道。
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表