使用ajax提交表单时出错
Error in submitting form using ajax
由于某种原因,表单没有被提交。我已经使用ajax表单保存表单的详细信息在我的数据库。
网站链接如下:http://www.famproperties.com/mudon/Abu-Dhabi/villas.html
脚本代码如下:
<script>
$(document).ready(function() {
$("#submit-form-button").click(function() { submitForm(); });
});
function submitForm() {
if ( $("#NAME").val() == '' ||
$("#EMAIL").val() == '' ||
$("#MOBILE").val() == '' ||
$("#NOTE").val() == '' )
{ alert ("All field are required");}
else {
$.ajax({
type: "POST",
url: "http://famproperties.com/real_estate/property/contact/lead/",
data: {
NAME: $("#NAME").val(),
EMAIL: $("#EMAIL").val(),
MOBILE: $("#MOBILE").val(),
NOTE: $("#NOTE").val(),
SOURCE: 'MSB.COM'
},
success: function() {
alert("Thanks, Our specialist will contact you soon.");
},
dataType: 'html'
});
$("#NAME").val('');
$("#EMAIL").val('');
$("#MOBILE").val('');
$("#NOTE").val('');
}};
</script>
这是表单代码。
<!--NEW FORM -->
<div class="form-horizontal" role="form" accept-charset="UTF-8" action="http://famproperties.com/real_estate/property/contact/lead/" autocomplete="on" id="pro-form" method="post">
<div class="form-group">
<label for="NAME" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="NAME" required="" placeholder="Name">
</div>
</div>
<div class="form-group">
<label for="EMAIL" class="col-sm-2 control-label ">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="EMAIL" required="" placeholder="me@example.com">
</div>
</div>
<div class="form-group">
<label for="MOBILE" class="col-sm-2 control-label">Mobile</label>
<div class="col-sm-10">
<input type="phone" class="form-control inputs" id="MOBILE" required="" placeholder="Mobile">
</div>
</div>
<div class="form-group">
<label for="NOTE" class="col-sm-2 control-label">Message</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="NOTE" required="" placeholder="Note">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<a href="#" onclick="return false" class="btn btn-default btn-lg button" id="submit-form-button" style="background-color: #ffc600;
color: #2a292a;
width: 100%;"> Submit <span class="fa fa-chevron-right fa-1x"></span><span class="fa fa-chevron-right fa-1x"></span> </a>
</div>
</div>
</div>
<!--NEW FORM-->
看到http://www.famproperties.com/mudon/Abu-Dhabi/villas.html上的页面,你甚至没有加载jquery检查控制台,你会看到这个错误:
Uncaught ReferenceError: $ is not defined
这就是为什么ajax不工作
编辑:对不起,再次检查你的代码,我看到你正在加载jQuery,但你试图在加载它之前使用jQuery。因此,尝试将jquery脚本标签移动到header或将js移动到jquery脚本标签下方。
相关文章:
- 可以't让我的if语句处理js中的html表单输入
- 如何使用WCF服务和javascript表单post上传.doc文件
- 处理表单时显示图像时出错
- 从 Html 表单 Meteor javascript 获取 Var 时出错
- 使用启动引导“代理”主题的提交表单时出错
- 使用removeChild删除多个表单输入时出错
- Dynamics CRM自定义表单事件Javascript出错
- AngularJS空表单验证出错
- 当表单元素包含带有一些特殊符号的id时,jQuery验证器会出错'无法识别的表达式'
- jquery validate和ajax post表单的验证表单空白文本区域出错
- JS验证登录表单-我出错的地方
- 从jQuery发送click()时,Web表单验证出错
- 在chrome扩展中使用jquery填写表单时出错
- 使用ajax提交表单时出错
- 获取“null”或“不是对象”;验证表单时出错
- 在下载文件出错的情况下,管理表单提交上的JSON服务器响应
- 使用带有wordpress插件的Jquery序列化表单时出错
- 使用 Jaunt 单击表单中的按钮时出错
- 当表单提交不被接受时,依赖选择器就会出错
- jQuery的preventdefault在表单第二次提交时出错