我有我的代码的一些问题,我试图分开我的表单功能到另一个php文件,并使用ajax函数调用窗体取决于ID。但是,当我分开窗体函数后,提交按钮不能调用ajax函数。提交按钮将不会触发ajax功能
这里是我用来触发Ajax功能,从另一个PHP显示形式进入sponsor.php的sponsor.php示例代码:
<!-- Ajax show form function-->
<script>
function showSponsor(str) {
if (str == "") {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","getSponsorForm.php?sponsor="+str,true);
xmlhttp.send();
}
}
</script>
的结果恢复成功后它就会出现在形成在这里:
<div id="txtHint"><b>Please Select Sponsor Edit Button To Start.</b></div>
。由此这里是从getSponsorForm.php检索,才能在展现形式:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<?php
$q = intval($_GET['sponsor']);
include 'dbConnection.php';
global $dbLink;
$query="SELECT * FROM sponsor_item WHERE sponsor_item_id = '".$q."'";
$result = $dbLink->query($query);
// Numeric array
while($row=mysqli_fetch_array($result,MYSQLI_ASSOC)){
echo '
<!--Banner Item No 1 Start-->
<div class="box box-primary1">
<div class="box-header">
<h3 class="box-title">Edit Sponsor No.'.$row["sponsor_item_id"].' <small>编辑器</small></h3>
</div>
<div class="box-body">
<form class="form" id="form" action="" method="POST" enctype="multipart/form-data">
<div class="box-body">
<input type="hidden" name="sponsor_id" value="'.$row["sponsor_item_id"].'"></input>
<div class="form-group" >
<label for="sponsorTitle">Sponsor Title 赞助称号</label>
<input type="text" class="form-control" name="sponsorTitle" id="sponsorTitle" placeholder="Please Enter Name" onChange="checkDisabled(testing);">
</div>
<div class="form-group" >
<label for="sponsorDescription">Sponsor Description 赞助描述</label>
<input type="text" class="form-control" name="sponsorDescription" id="sponsorDescription" placeholder="Please Enter Name" onChange="checkDisabled(testing);">
</div>
<div class="form-group">
<label for="exampleInputFile">File input</label>
<input type="file" id="uploaded_file" name="uploaded_file" onChange="checkDisabled(testing);"><br>
<p class="help-block">Your picture size not more than 2MB. (Only JPEG or JPG is allowed)</p>
</div>
<div class="checkbox">
<button id="testing" type="submit" class="btn btn-primary">Update</button>
</div>
</div><!-- /.box-body -->
</form> <!-- Date range -->
<!-- /.form group -->
<!-- Date and time range -->
<!-- /.form group -->
<!-- Date and time range -->
<!-- /.form group -->
</div><!-- /.box-body -->
</div><!-- /.box -->
<!--Banner Item No 1 End-->';
}
mysqli_free_result($result);
// Close the mysql connection
$dbLink->close();
?>
</body>
</html>
当我这样做,一切都工作,除非一旦表单显示出来,我填写输入字段,并希望按下提交按钮,它只是不会触发sponsor.php上的ajax函数,这是在这里:
//File and text upload with formDATA function
$("form#form").submit(function(){
var formData = new FormData($(this)[0]);
$.ajax({
url:'sponsorItem.php',
type: 'POST',
data: formData,
async: false,
beforeSend: function(){
if(confirm('Are you sure?'))
return true;
else
return false;
},
cache: false,
contentType: false,
processData: false
}).done(function() {
//do something if you want when the post is successfully
if(!alert('Banner Had Successfully Updated.')){document.getelementbyclassname('form').reset()}
});
return false;
});
我做错了什么?请指引我through.Thanks :)
脚本不应该用'
返回一个文件和' '',因为你将它放到''内的元素的'innerHTML'中。 – Barmar 2015-03-03 07:16:28你的意思是我应该从getSponsorForm.php中删除body和head标签吗? – 2015-03-03 07:18:26