jquery - 使用 ajax 发布序列化的表单数据
问题描述
我有这个表格
<div class="tab-pane" id="trade">
<br/>
<div class="well">There are currently a total of <b>$traders traders</b> and this session has a total of <b>Ksh $total</b> you can earn this very minute.</div>
<form class="form-horizontal" name="trade">
<br/>
<div class="form-group">
<label class="control-label col-sm-2" for="email">Telephone Number:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="email" placeholder="Enter Telephone Number" name="telephone" required/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="email">Id Number:</label>
<div class="col-sm-10">
<input type="number" class="form-control" id="email" placeholder="Enter Id Number" name="nid" required/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="email">Amount:</label>
<div class="col-sm-10">
<input type="number" class="form-control" id="email" placeholder="Enter Amount" name="amount" required/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="email">Direction:</label>
<div class="col-sm-10">
<select class="form-control" name="direction"><option value="up">Up</option><option value="down">Down</option></select>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-success pull-right">Submit</button>
</div>
</div>
</form>
</div>
我有这个作为我的 jquery
$(document).ready(function(){
var datastring = $("#trade").serialize();
$.ajax({
type: "POST",
url: "http://localhost/lords/trade.php",
data: datastring,
dataType: "json",
success: function(data) {
alert(data);
},
error: function() {
}
});
});
但是,我并没有停止默认设置,并且表单重新加载并且没有发布任何数据。
我试过这个
var frm = $('#trade');
frm.submit(function (ev) {
$.ajax({
type: 'post',
url: 'http://localhost/lords/trade.php',
data: frm.serialize(),
success: function (data) {
alert(data);
}
});
ev.preventDefault();
});
但这不会发布数据。我正在使用 jquery 3.3.1
解决方案
在表单标签上添加 id="name" 或更改
var frm = $('#trade');
至
var frm = $('form[name="trade"]')
推荐阅读
- python - 文本分类方法
- google-api - Google 通讯录 API“无效请求”。更改名称时出现 400 错误
- android - Nativescript 插件,包括 Android SDK 而不是 aar
- excel - 为什么代码没有点击按钮?
- c# - 将 DeflateStream 文件内容发送到 Azure 消息队列
- matlab - 如何从另一个函数定义变量?
- reactjs - this.SetState 在多次调用中未定义
- python-3.x - 如何修复 docker 上与 pygame 相关的“pygame.error:没有可用的视频设备”错误?
- css - 如何防止实时调整图像大小(在页面加载期间)
- postman - 如何重命名使用 npm 包 newman-reporter-csv 生成的 newman csv 报告