如何通過button將form表單的數據提交到action層

這篇文章將為大家詳細講解有關如何通過button將form表單的數據提交到action層，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

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" title="請選擇">
      <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層”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。