提交包含文本输入和文件输入的表单
Submit form containing text input and file input
我正在使用Jquery和Ajax向php页面提交一个包含text input
和file input
的表单,但在提交之前,我想在提交之前验证文本输入。
下面是表单页
<form id="registrationForm" method="POST" name="registrationForm" enctype="multipart/form-data">
<input type="text" name="firstName" id="firstName" />
<input type="file" name="file" id="file" />
<button type="submit"> UPLOAD</button>
</form>
和Javascript页面
$('#registrationForm').validate({
rules: {
firstName:{
required: true
}
},
message:{
firstName: {
required: "Please Enter Name"
}
},
submitHandler : function(){
//grab all form data
var formData = new FormData(this);
$.ajax({
url: 'submitPage.php',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function(data) {
$('#message').html(data);
$('#message').html(data).hide().fadeIn(1500,function(){$('#message')});
}
});
}
});
和PHP Page,即接收页面
<?php
$firstName=$_POST['firstName'];
$file=$_FILES['file']['name'];
echo $firstName;
echo $file;
?>
在php接收页面返回null。我真希望有人能帮帮我。谢谢。
$('#registrationForm').validate({
rules: {
firstName:{
required: true
}
},
message:{
firstName: {
required: "Please Enter Name"
}
},
submitHandler : function(){
//grab all form data
var formData = new FormData(document.querySelector("form"));
$.ajax({
url: 'submitPage.php',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function(data) {
$('#message').html(data);
$('#message').html(data).hide().fadeIn(1500,function(){$('#message')});
}
});
}
});
相关文章:
- Nodejs服务器在解析之前生成输入表单
- 如何创建打开警报框的输入表单
- JavaScript onChange 事件侦听器对输入表单不起作用
- 如何在 OnKeyPress 事件后获取输入表单元素的值
- 单输入表单 - 特殊情况 |停止表单提交
- 需要输入表单验证
- 如何在谷歌图表中使用输入表单值
- 使用jquery可交换地更改两个html输入表单值
- 当从jqueryajax调用输入表单时,它不起作用
- 控制器作为搜索输入表单的语法
- 删除带有按钮的输入表单失败
- 验证带有2个小数点的浮点形式的输入表单
- AngularJS:输入表单在分部中不起作用
- 如何从php中的输入表单调用Javascript函数,以更改HTML
- 输入表单中的Sharepoint javascript
- 当点击输入表单时,为Raphael制作的对象添加光晕
- 当用户将数据输入表单时要知道的事件
- 保存输入表单后ImageMap颜色更改
- 链接输入表单中的填充脚本
- 有关多个输入表单验证的问题