❶ php form表單怎麼把數據提交到本頁而不跳轉
PHP把表單提交到本頁,這個的話,我們是通過<form action="提交的文件名">來實現的,還有一個傳值的方式,post或者是get可以通過METHOD來實現的,這里我寫一段代碼:
<html>
<head></head>
<body>
<form action='文件名' method="post">
姓名<input type='text' value="">
密碼<input type='text' value="">
email<input type='text' value="">
</form>
</body>
</html>
❷ PHP中一個form表單用ajax實現提交之後,怎麼恢復到以前的狀態
$(form).trigger('reset');
在function裡面用這句就可以了,trigger('reset')
觸發form的reset[重置]事件相當於點擊reset按鈕。
❸ Jquery通過Ajax方式來提交Form表單
ajax提交表單說白了就是,用ajax把數據post都後台去而已。你可以在後台把數據列印一下看看是否成功,再做進一步調試。
❹ 關於jQuery ajax的問題,在php代碼中如何接收HTML頁面form表單提交過來的數據
Ajax不是很熟,所以不知道提交過去沒
你用的是post提交,在php頁可以這么寫
<?php echo $_POST["message"]; ?>
還可以
<?php echo $_REQUEST["message"]; ?>
_REQUEST既可以接收post傳值,也可以接收get傳值
❺ 做一個注冊界面,用ajax提交form表單,php得到數據。求詳細程序
做驗證吧,用jquery 我的代碼粘貼給你
//ajax處理注冊
$(function(){
$("[name='username']").blur(function(){
var s=$("[name='username']").val();
$.post("regajax.php",{name:'username',value:s}, function(data){
$('#chkuser').html(data);
});
});
<?php
define('ACC',true);
header("Content-Type: text/html;charset=utf-8");
header("Cache-Control:no-cache");
include('../include/init.php');
$type=$_POST['name'];
$value=$_POST['value'];
$reg=new regmod();
if ($type=='username') {
$info='';
if ($value=='') {
$info= "用戶名不能為空";
}
else if (strlen($value)<3 || strlen($value)>16) {
$info= "用戶名必須在3到16個字元之間";
}
else if ($reg->ajax($value)) {
$info="用戶名已經存在";
}
echo $info;
}
❻ thinkphp裡面的ajax關於表單提交的寫法
<html>
<head>
<scripttype="text/javascript"src="__PUBLIC__/js/jquery-1.7.1.min.js"></script>
<scripttype="text/javascript">
$(function(){
$('input:button').click(function(){
var$title=$('input[name="title"]').val();
var$message=$('input[name="message"]').val();
$mess=$('#mess');
$.getJSON('__URL__/add',{title:$title,message:$message},function(json){
//alert(json);returnfalse;
if(json.status==1){
$mess.slideDown(3000,function(){
$mess.css('display','block');
}).html('標題為'+json.data.title+'信息為'+json.data.message);
}else{
$mess.slideDown(3000,function(){
$mess.css('display','block');
}).html('信息添加失敗,請檢查');
}
});
})
})
</script>
</head>
<body>
<divstyle="display:none;color:red;"id="mess"></div>
<formaction=""method="get">
標題:<inputtype="text"name="title"/><br/>
信息:<inputtype="text"name="message"/><br/>
<inputtype="button"value="提交"/>
</form>
</body>
</html>
上面是前段代碼
MessageAction.class.php頁面代碼如下:
<?php
{
functionindex(){
$this->display();
}
functionadd(){
//ajaxReturn(數據,'提示信息',狀態)
$m=M('message');
if($m->add($_GET)){
$this->ajaxReturn($_GET,'添加信息成功',1);
}else{
$this->ajaxReturn(0,'添加信息失敗',0);
}
}
}
?>
❼ php ajax提交表單
1、按鈕 #dosubmit 點擊事件觸發函數browseFolder,沒有定義。
2、按鈕 #dosubmit 是沒有 submit 事件的,只有表單有,所以你給它綁定 submit 事件是沒有用的。
解決辦法:
//定義按鈕#dosubmit點擊事件的觸發函數browserFolder即可。
functionbrowserFolder(){
//這里執行ajax
$.ajax({
//codehere
});
}
❽ form表單提交跳轉頁面的問題。我用的PHP+Mysql做的,這是表單代碼,想做一個ajax提交。
首先在body中引入jquery,如下:
<scriptsrc="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"type="text/javascript"></script>
然後建立script
<script>
$(document).ready(function(){
$("#subper").click(function(event){
event.preventDefault();//禁止使用submit提交數據,因為我們要用ajax啊
varcheckbox=newArray();//建立數組收集checkbox的選中值
$('input[name="checkbox[]"]:checked').each(function(){//在這里使用checkbox[]命名收集checkbox的值其實沒什麼意義了
checkbox.push($(this).val());//向數組中添加元素
});
vardata={//收集傳遞的參數,以json的形式
checkbox:checkbox,
as:$("input:radio[name='as']:checked").val(),
username:$('input[name="username"]).val(),
.
.//自己補充後面的
.
};
$.ajax({
type:'POST',
data:data,
dataType:"json",
url:$("form").attr('action'),
success:function(msg){
$('.answer').html(msg);//如果沒有class=answer,這里沒有任何效果
}
});
});
});
</script>
需要注意的是,在php 伺服器端,記得把json的數據轉換成php格式的,使用json_decode($json,true),就可以得到一個大數組,用這個大數組進行下面的php活動。因此你需要對伺服器端的代碼做一些小小的修改。
❾ 表單submit怎麼用ajax提交表單
看你是用原生好jquery的實現方式
如果jquery是submit的方式
一般的 燦推科技 或開源的php系統 很多的以介面形式提交數據的,你需要給 form表單加個id;
在用submit提交數據,ajax方法寫在提交的事件里就可以,ajax裡面綁定你需要的參數和地址
❿ PHP 如何用ajax做文件上傳
通過傳統的form表單提交的方式上傳文件:
[html] view plain 在CODE上查看代碼片派生到我的代碼片<form id= "uploadForm" action= "http://localhost:8080/cfJAX_RS/rest/file/upload" method= "post" enctype ="multipart/form-data">
<h1 >測試通過Rest介面上傳文件 </h1>
<p >指定文件名: <input type ="text" name="filename" /></p>
<p >上傳文件: <input type ="file" name="file" /></p>
<p >關鍵字1: <input type ="text" name="keyword" /></p>
<p >關鍵字2: <input type ="text" name="keyword" /></p>
<p >關鍵字3: <input type ="text" name="keyword" /></p>
<input type ="submit" value="上傳"/>
</form>
不過傳統的form表單提交會導致頁面刷新,但是在有些情況下,我們不希望頁面被刷新,這種時候我們都是使用Ajax的方式進行請求的。
Ajax的方式進行請求:
[javascript] view plain 在CODE上查看代碼片派生到我的代碼片$.ajax({
url : "http://localhost:8080/STS/rest/user",type : "POST",
data : $( '#postForm').serialize(),
success : function(data) {
$( '#serverResponse').html(data);
},
error : function(data) {
$( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);}
});
通常我們提交(使用submit button)時,會把form中的所有表格元素的name與value組成一個queryString,提交到後台。這用jQuery的方法來說,就是serialize。
通過$('#postForm').serialize()可以對form表單進行序列化,從而將form表單中的所有參數傳遞到服務端。
但是上述方式,只能傳遞一般的參數,上傳文件的文件流是無法被序列化並傳遞的。
不過如今主流瀏覽器都開始支持一個叫做FormData的對象,有了這個FormData,我們就可以輕松地使用Ajax方式進行文件上傳了。
關於FormData及其用法
FormData是什麼呢?我們來看看Mozilla上的介紹。
XMLHttpRequest Level 2添加了一個新的介面FormData.利用FormData對象,我們可以通過JavaScript用一些鍵值對來模擬一系列表單控制項,我們還可以使用XMLHttpRequest的send()方法來非同步的提交這個"表單".比起普通的ajax,使用FormData的最大優點就是我們可以非同步上傳一個二進制文件.
所有主流瀏覽器的較新版本都已經支持這個對象了,比如Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+。
參見:https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/FormDataConstructor
FormData()
想得到一個FormData對象:
var formdata = new FormData();
W3c草案提供了三種方案來獲取或修改FormData。
方案1:創建一個空的FormData對象,然後再用append方法逐個添加鍵值對:
var formdata = new FormData();
formdata.append("name", "呵呵");
formdata.append("url", "http://www..com/");方案2:取得form元素對象,將它作為參數傳入FormData對象中!
var formobj = document.getElementById("form");var formdata = new FormData(formobj);
方案3:利用form元素對象的getFormData方法生成它!
var formobj = document.getElementById("form");var formdata = formobj.getFormData()
Method
FormData.append
本方法用於向已存在的鍵添加新的值,如該鍵不存在,新建之。
語法
formData.append(name, value);
formData.append(name, value, filename);
注: 通過 FormData.append()方法賦給欄位的值若是數字會被自動轉換為字元(欄位的值可以是一個Blob對象,一個File對象,或者一個字元串,剩下其他類型的值都會被自動轉換成字元串).
參數解釋
name
鍵 (key), 對應表單域
value
表單域的值
filename (optional)
The filename reported to the server (a USVString), when a Blob or File is passed as the second parameter. The default filename for Blob objects is "blob".
FormData.delete
將一對鍵和值從 FormData 對象中刪除。
formData.delete(username);
FormData.get
返回給定鍵的第一個值
formData.append('username', 'Justin');
formData.append('username', 'Chris');
formData.get(username); // "Justin"
FormData.getAll
返回給定鍵的所有值
formData.append('username', 'Justin');
formData.append('username', 'Chris');
formData.getAll(username); // ["Justin", "Chris"]
FormData.has
檢查是否包含給定鍵,返回 true 或 false
formData.has(username);
FormData.set
設置給定鍵的值
formData.set(name, value);
formData.set(name, value, filename);
瀏覽器兼容情況
來自 MDN:
Desktop
FeatureChromeFirfox(Gecko)Intenet ExplorerOperaSafariBasic support7+4.0(2.0)10+12+5+
append with filename(Yes)22.0(22.0)???
delete, get, getAll, has, setBehind FlagNot supportedNot supported(Yes)Not supportedMobile
FeatureAndroidChrome AndroidFirfox Mobile (Gecko)Firfox OS (Gecko)IE MobileOpera MobileSafari MobileBasic support3.0?4.0(2.0)1.0.1?12+?
append with filename??22.0(22.0)1.2???
delete, get, getAll, has, set(Yes)(Yes)Not supportedNot supportedNot supported(Yes)Not supported2015年06月04日發布
Ajax通過FormData上傳文件
1.使用<form>表單初始化FormData對象方式上傳文件HTML代碼
<form id="uploadForm" enctype="multipart/form-data">
<input id="file" type="file" name="file"/>
<button id="upload" type="button">upload</button>
</form>
javascript代碼
$.ajax({
url: '/upload',
type: 'POST',
cache: false,
data: new FormData($('#uploadForm')[0]),
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
這里要注意幾點:
processData設置為false。因為data值是FormData對象,不需要對數據做處理。
<form>標簽添加enctype="multipart/form-data"屬性。
cache設置為false,上傳文件不需要緩存。
contentType設置為false,不設置contentType值,因為是由<form>表單構造的FormData對象,且已經聲明了屬性enctype="multipart/form-data",所以這里設置為false。
上傳後,伺服器端代碼需要使用從查詢參數名為file獲取文件輸入流對象,因為<input>中聲明的是name="file"。
如果不是用<form>表單構造FormData對象又該怎麼做呢?
2.使用FormData對象添加欄位方式上傳文件
HTML代碼
<div id="uploadForm">
<input id="file" type="file"/>
<button id="upload" type="button">upload</button>
</div>
這里沒有<form>標簽,也沒有enctype="multipart/form-data"屬性。
javascript代碼
var formData = new FormData();
formData.append('file', $('#file')[0].files[0]);$.ajax({
url: '/upload',
type: 'POST',
cache: false,
data: formData,
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
這里有幾處不一樣:
append()的第二個參數應是文件對象,即$('#file')[0].files[0]。
contentType也要設置為『false』。
從代碼$('#file')[0].files[0]中可以看到一個<input type="file">標簽能夠上傳多個文件,只需要在<input type="file">里添加multiple或multiple="multiple"屬性。
3.伺服器端讀文件
從Servlet 3.0 開始,可以通過 request.getPart() 或 request.getPars() 兩個介面獲取上傳的文件。