1. 程式人生 > >Form表單只提交資料而不進行頁面跳轉的方法

Form表單只提交資料而不進行頁面跳轉的方法

解決方案:將資料提交到saveReport(form的action指向)頁面,但是頁面又不進行跳轉,即保持當前頁面不變呢?利用jquery的ajaxSubmit函式以及form的onsubmit函式完成

一般的寫法為:

<form action="saveReport.htm" method="post"> 
…… 
<input type="submit" value="儲存報告"/> 
</form> 

點選submit按鈕或直接回車可以將資料提交到saveReport頁面,但是提交後也會跳轉到saveReport頁面 ,如何做到
將資料提交到saveReport(form的action指向)頁面,但是頁面又不進行跳轉,即保持當前頁面不變呢??

利用jquery的ajaxSubmit函式以及form的onsubmit函式完成,如下:

<form id="saveReportForm" action="saveReport.htm" method="post" onsubmit="return saveReport();"> 
    <input type="submit" value="儲存報告"/> 
</form> 

form增加一個id用於在jquery中呼叫,增加一個onsubmit函式用於submit前自己提交表單
saveReport對應函式為:

function
saveReport() {
// jquery 表單提交 $("#showDataForm").ajaxSubmit(function(message) { // 對於表單提交成功後處理,message為提交頁面saveReport.htm的返回內容 }); return false; // 必須返回false,否則表單會自己再做一次提交操作,並且頁面跳轉 }

相關推薦

Form提交資料進行頁面方法

解決方案:將資料提交到saveReport(form的action指向)頁面,但是頁面又不進行跳轉,即保持當前頁面不變呢?利用jquery的ajaxSubmit函式以及form的onsubmit函式完成 一般的寫法為: <form action="

form提交數據進行頁面的解決方案

ner 按鈕 pos mes inline -c ddr for msg 轉載   將數據提交到saveReport(form的action指向)頁面,但是頁面又不進行跳轉,即保持當前頁面不變呢?利用jquery的ajaxSubmit函數以及form的onsubmit函數完

Form提交數據,頁面,返回

bre ava case java ssr ace 引用 except erl html代碼: <form method="post" action="Handler/UserHandler.ashx?action=Test" onsubmit="return Rut

PHP formpost提交 $_POST接收資料

新手,最近在學習PHP,WAMP環境下碰到了同樣的問題,裝完PhpStorm後寫了個表單頁面和一個後臺列印$_POST的測試程式,POST方法接收不到資料,GET和REQUEST可以,另外如果把專案直接放在Apache伺服器的工作目錄下,然後在位址列輸入localhost是可以正常執行的。前面有答主說到了埠

關於http get和formpost提交資料大小限制

之前我去面試,面試的人問了我些問題,其中令我印象深刻的就是如題的兩個,回來後特意去查找了一下,關於http get提交資料上限,之前只知道資料上限差不多是幾kb大小,具體為什麼卻沒有了解 httpget是通過url來傳遞資料,url不存在上限的問題,http協

shiro 配置註解後無權訪問進行頁面異常:org.apache.shiro.authz.UnauthorizedException: Subject does not have permission

class bject ram body pac framework simple -- 管理 該問題需要使用異常管理: <!-- 無權訪問跳轉的頁面 --> <bean class="org.springframework.web.ser

基於formsubmit提交

方法一:target <html> <body> <form action="" method="post" target="nm_iframe"> <input type="text" id="id_input_text" name="nm_input_te

formajax提交json資料

前端頁面: <form id="userInfo" > <div class="weui-cell"> <div class="weui-cell__hd"><label class="weui-lab

如何 給 文章 新增 標籤 以及 如何 讓 js 中的資料 跟隨 form 一起提交到 後臺

設計思路 檔案和,標籤的關係,多對多的關係。 需要一個標籤表,和,文章標籤中間表。 文章和,標籤的關係,多對多的關係。 一個標籤對應多篇文章,一篇文章對應多個標籤 。 標籤,增刪改查,可以在後臺管理。 這個文章標籤中間表,是如果1篇文章有幾個標籤,就有幾條資料,只是對應同一個文章id

1、Jquery formajax提交 2、jquery.filter校驗多個相同型別的文字框是否輸入資料有重複

JSP引用該JS <script type="text/javascript" src="http://malsup.github.com/jquery.form.js"></script> 表單儲存按鈕 onclick=save(); func

easyui關於解決tab新增的頁面通過href載入資料內容的頁面重新整理後form重複提交的問題;

1.分析 Easyui中的tabs元件以href方式載入目標頁面,如果目標頁面中有dialog或者window這類的easyui元件中放了form.那麼在關閉這個tab再次開啟或者點選重新整理.如果進行form提交操作,後臺就會收到兩次提交請求,再次重複以上操作會收到3

easyui formajax提交後,返回資料處理

問題由來: 因為使用了easyui form表單提交資料和上傳圖片,然後會返回一個約定-JSON物件,ie和火狐都會提示下載你所返回的json,chrome瀏覽器雖然不會提示,但控制檯還是會打印出資源被解析成 Document, 但傳輸時使用的 MIME 型別是 appl

jQuery使用ajaxSubmit()提交(在希望頁面的情況下)

ont .ajax 引入 當前 data fun get orm mit 原文:http://www.jb51.net/article/48728.htm ajaxSubmit(obj)方法是jQuery的一個插件jquery.form.js裏面的方法,所以使用此方法需要先

form右邊彈窗提示能為空

style class RM form表單 == code div span tips 1 if (key == null || key == "") { 2 layer.tips(‘流程標識key不能為空‘, $(‘#search_input‘)

批量審批功能的前端formajax提交多文件多數據

定義 In lds AD inline inb 如果 問題 PE 實現的功能: 勾選需要批量修改的信息,點擊批量審批按鈕,彈出一個用boostrap框架做的模態框,顯示出勾選內容的信息,並且填寫了內容,上傳了多文件之後,通過ajax發送數據。 第一步:先獲取選中項該行中

form可以提交,阻止頁面

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body&g

SpringMVC——通過form繫結資料

今天寫一個簡單的專案用到form表單繫結資料,這裡介紹一下方法。 首先需要配置好相應的檔案,這個步驟我這裡就不再贅述,直接進入主題。 我的controller程式碼如下: @RequestMapping(value ="views/html_jsp/revise_good",prod

使用layui的時候form中的select等能渲染

1.使用的是動態的新增一些內容到表單裡面去,然後就出現了原始的html標籤樣式,看了問題的解決也有,嘗試了一下,以為是將form.render放到html頁面裡的script裡就可以了,但是通過實驗發現,不能放在頁面裡的script標籤裡面,應該放在你動態新增的元素的方法的後面,也就是新

struts 獲取form中的資料

一、通過action獲取表單提交的資料:ActionContext         // action中的內容 public String form1(){ System.out.println("通過action獲取表單提交的資料:Ac

使用zTree在form提交和修改回顯

<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <