Ajax 未在模态弹出窗口中触发
Ajax not firing inside Modal Popup
目前我有一个按钮可以这样查看购物车内容:
<a href="#" class="btn btn-info" role="button" data-toggle="modal" data-targets="showvendorcart1" data-target="#showvendorcartModal" data-async="true" data-cache="false" data-endpoint="vendor/showcart/{{$vendorid}}">SHOW CART</a>
data-target 用于我的模态
data-targets 用于在 ajax 端点 returns 响应
之后我的模态主体
我的Ajax代码如下:
$('a[data-async="true"]').click(function(e){
e.preventDefault();
var self = $(this),
url = self.data('endpoint'),
target = self.data('targets'),
cache = self.data('cache');
$.ajax({
url: url,
cache : cache,
success: function(data){
if (target !== 'undefined'){
$('#'+target).html( data['response'] );
}
}
});
});
(由 jQuery and data-attributes to handle all ajax calls? 提供)
现在一旦模式对话框弹出窗口出现,我在 table 中有一些网格项目,例如:
<table id="itemstable" class="table table-striped table-bordered">
<thead class="fixed-header">
<tr>
<th>QTY</th>
<th>SKU</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>' . $v->qty . '</td>
<td>' . $v->sku . '</td>
<td><a href="#" class="btn btn-danger" data-targets="showvendorcart1" data-async="true" data-cache="false" data-endpoint="vendor/removecart/' . $v->id . '"> X </a>
</tr>
</tbody>
</table>
我 运行 遇到的问题是每个 table 行项目都有另一个 ajax 端点调用,但是这次当我单击它时, Ajax根本没有开火。我查看了我的浏览器检查器,但甚至没有错误或尝试。
我是否遗漏了一些东西,因为它实际上与我 运行 获取弹出窗口并在正文中显示响应的代码相同,但现在唯一的区别是我在模态中执行此操作。
感谢您的帮助!
改成这个应该可以了。
$(document).on('click', 'a[data-async="true"]', function (e) {
e.preventDefault();
// your code here
});
目前我有一个按钮可以这样查看购物车内容:
<a href="#" class="btn btn-info" role="button" data-toggle="modal" data-targets="showvendorcart1" data-target="#showvendorcartModal" data-async="true" data-cache="false" data-endpoint="vendor/showcart/{{$vendorid}}">SHOW CART</a>
data-target 用于我的模态
data-targets 用于在 ajax 端点 returns 响应
之后我的模态主体我的Ajax代码如下:
$('a[data-async="true"]').click(function(e){
e.preventDefault();
var self = $(this),
url = self.data('endpoint'),
target = self.data('targets'),
cache = self.data('cache');
$.ajax({
url: url,
cache : cache,
success: function(data){
if (target !== 'undefined'){
$('#'+target).html( data['response'] );
}
}
});
});
(由 jQuery and data-attributes to handle all ajax calls? 提供)
现在一旦模式对话框弹出窗口出现,我在 table 中有一些网格项目,例如:
<table id="itemstable" class="table table-striped table-bordered">
<thead class="fixed-header">
<tr>
<th>QTY</th>
<th>SKU</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>' . $v->qty . '</td>
<td>' . $v->sku . '</td>
<td><a href="#" class="btn btn-danger" data-targets="showvendorcart1" data-async="true" data-cache="false" data-endpoint="vendor/removecart/' . $v->id . '"> X </a>
</tr>
</tbody>
</table>
我 运行 遇到的问题是每个 table 行项目都有另一个 ajax 端点调用,但是这次当我单击它时, Ajax根本没有开火。我查看了我的浏览器检查器,但甚至没有错误或尝试。
我是否遗漏了一些东西,因为它实际上与我 运行 获取弹出窗口并在正文中显示响应的代码相同,但现在唯一的区别是我在模态中执行此操作。
感谢您的帮助!
改成这个应该可以了。
$(document).on('click', 'a[data-async="true"]', function (e) {
e.preventDefault();
// your code here
});