Home >Web Front-end >JS Tutorial >An example of submitting form data to the action layer through buttons

An example of submitting form data to the action layer through buttons

巴扎黑
巴扎黑Original
2017-09-09 10:03:161861browse

The following editor will bring you an example of submitting form form data to the action layer through buttons. The editor thinks it’s pretty good, so I’ll share it with you now and give it as a reference. Let’s follow the editor and take a look.

You don’t need to write the path of the action in the form. You need to give the form a unique id, and put the label name="in action" in the form of the information you want to submit. javabeanObject.javabeanProperties". Add an onclick() click event to the button button and implement the click event. In the onclick() method, submit the data in the form to the action layer through ajax

JSP page Code in:


   <form id="handleform">
    <!-- 根据学生id修改学生信息 -->
    <input type="hidden" name="student.stuid"/><!-- 隐藏学生id -->
    <p class="input-group el_modellist" role="toolbar">
     <span class="el_spans">要修改的班级:</span>
     <select class="selectpicker form-control" name="student.className" id="fmchechunit" title="请选择">
      <option value="0">--请选择班级--</option>
      <option value="1">软件一班</option>
      <option value="2">软件二班</option>
     </select>
    </p>
    <span class="el_spans">学生姓名:</span>
    <input type="text" id="student.name"/>
     <p 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>
     </p>

     <p class="modal-footer">
      <button id="submitButton" onclick="saveButton()" type="button" class="btn btn-primary">更新</button>
     </p>
   </form>
   <script type="text/javascript">
    function saveButton(){
      //通过ajax异步将数据发送给action层
      $.ajax({
       url : &#39;${pageContext.request.contextPath}/stu/stu_upstudent.action&#39;,//这里写上你的action路径
       data : $("#handleform").serialize(),//将你在form表单上提交的数据序列化
       type : &#39;POST&#39;, //提交方式
       dataType : &#39;json&#39;, //提交的数据类型
       async:true, //是否异步
       success : function(data) {//这是个回调函数 data表示从action中传过来的json数据
       //弹出从action层传过来的json格式的数据(用来显示是否更新成功)
       alert(data.result);
       }
      });
    }
   </script>

Code in action layer:


@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 code:


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;
 }
 
}

The above is the detailed content of An example of submitting form data to the action layer through buttons. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn