Html表单提交按钮未调用successs方法
Html form submit button not calling succes method?
Html形式:
<form class="form-horizontal" id="contactfrm" onsubmit="contactus()">
<fieldset class="scheduler-border">
<!-- Form Name -->
<legend class="scheduler-border">Fill contact details</legend>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="fname">First Name</label>
<div class="col-md-6"><input id="fname" name="firstName" type="text" placeholder="First Name" class="form-control input-md" title="Enter your First Name" required="required"></div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="lname">Last Name</label>
<div class="col-md-6"><input id="lname" name="firstName" type="text" placeholder="Last Name" class="form-control input-md" title="Enter your Last Name" required="required"></div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label" for="button"></label>
<div class="col-md-4">
<button type="submit" value="Submit" class="btn btn-success" id="submit" />
</div>
</div>
</fieldset>
</form>
脚本代码:
<script type="text/javascript">
function contactus(){
alert("hi");
var test = JSON.stringify({
"help": $('#help').val(),
"firstName": $('#fname').val(),
"lastName":$('#lname').val()
});
alert("test values are"+test);
$.ajax({
type: "POST",
contentType: 'application/json',
url: baseurl+"contact/add",
data: test,
dataType:"text",
success:successmethod,
error: function(data,status)
{
alert("Error "+status);
}
});
}
function successmethod(data){
document.getElementById("contactfrm").reset();
$('#showcontactmessage').show();
alert("Contact Details Saved");
}
</script>
锚定标签:
<a href="javascript:contactus();" class="btn btn-success">Contact us now</a>
在上面的表格中,当我使用锚标签提交表格时,一切都很好;调用函数并将值保存在数据库中,调用并执行success方法。但这里的问题是,当我使用button标记提交表单值时,值保存在databse中,但没有调用successs方法,而是调用error方法。。有什么需要帮忙的吗??
提交处理程序不会阻止表单提交。
JavaScript将运行,然后表单将立即提交。浏览器将离开当前页面并加载一个新页面,然后再获得对Ajax请求的响应。新页面上将不存在事件处理程序。
您需要阻止默认表单操作。使用90年代风格的方法,您需要从事件处理程序返回false
。
onsubmit="contactus(); return false;"
相关文章:
- electronic BrowserWindow的最小高度和宽度在hide()show()方法之后不起作用
- 有没有任何方法可以将控制器从文件加载到ui路由器$stateProvider中
- 数组在递归方法中设置为null
- 打破承诺链的好方法是什么
- 在使用Polymer'加载所有json文件后执行方法;s的核心ajax
- 使用“;这个“;JavaScript原型方法中的关键字
- 序列化数据属性中对象的最可靠方法
- 使用Objective-C的JavaScript注入方法
- 有没有一种方法可以添加相同的项目val=“0”;4〃;到JavaScript中数组的每个对象
- 有没有一种方法可以防止img get请求使用css或js发生
- Javascript,有没有一种方法可以将数组写成没有逗号或空格的单个文本字符串
- toBoolean方法类似于toString
- 如何在单击复选框后调用控制器方法
- 是否有任何方法可以使用jQuery替换在数组中定义值的文本
- 递归使用 eval() 是检查程序执行的好方法吗?
- 如何在webView,Android中从@JavascriptInterface方法调用Javascript
- toLocaleDateString和toLocaleString方法不尊重机器时区
- 有条件更新d3.js力图中节点的最佳方法
- TypeError:在不兼容的接收器nodejs上调用了方法Uint8Array.length
- Html表单提交按钮未调用successs方法