Javascript无法获取data-id
Javascript un-able to get data-id
在我的codeigniter项目中,我创建了一个模型,当用户可以删除页面时,但在他或她这样做之前,它会弹出一个警告引导模态。
由于某些原因,我不能让我的data-id
得到我的脚本。那么,当我点击yes来删除时它会将我发送到http://localhost/codeigniter/cms-1/admin/catalog/information/delete/
但应该会拾取data-id并在删除后添加它例如http://localhost/codeigniter/cms-1/admin/catalog/information/delete/2
问题:为什么脚本不检测和抓取我的数据id,并将其添加到url时点击是模态?
我认为这部分工作不正确
脚本
removeBtn.attr('href', removeBtn.attr('href').replace(/(&|'?)'d*/, '$1' + id));
<script type="text/javascript">
$('#modal-from-dom').on('show', function() {
var id = $(this).data('id'),
removeBtn = $(this).find('.danger');
removeBtn.attr('href', removeBtn.attr('href').replace(/(&|'?)'d*/, '$1' + id));
$('#debug-url').html('Delete URL: <strong>' + removeBtn.attr('href') + '</strong>');
});
$('.confirm-delete').on('click', function(e) {
e.preventDefault();
var id = $(this).data('id');
$('#modal-from-dom').data('id', id).modal('show');
});
</script>
查看data-id为data-id="<?php echo $information['information_id'];?>"
的视图
<div class="panel panel-default">
<div class="panel-heading">
<div class="clearfix">
<div class="pull-left">
<h1 class="panel-title" style="padding-top: 7.5px;"><?php echo $heading_title;?></h1>
</div>
<div class="pull-right">
<a href="<?php echo base_url('admin/catalog/information/add');?>" role="button" class="btn btn-success">Add Information Page</a>
</div>
</div>
</div>
<div class="panel-body">
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<td>Information Title</td>
<td class="text-right">Delete</td>
<td class="text-right">Action</td>
</tr>
</thead>
<tbody>
<?php if ($informations) {?>
<?php foreach ($informations as $information) {?>
<tr>
<td><?php echo $information['title'];?></td>
<td class="text-right">
<a href="<?php echo $information['delete'];?>" class="btn btn-danger confirm-delete" data-id="<?php echo $information['information_id'];?>">Delete <?php echo $information['title'];?></a>
</td>
<td class="text-right">
<a href="<?php echo $information['edit'];?>" class="btn btn-primary">Edit <?php echo $information['title'];?></a>
</td>
</tr>
<?php }?>
<?php } else { ?>
<tr>
<td class="text-center" colspan="4">No Results</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
<div class="panel-footer">
</div>
</div><!-- .panel .panel-default -->
模态
<?php if ($informations) {?>
<?php foreach ($informations as $information) {?>
<div class="modal fade" id="modal-from-dom">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>You are about to delete one track url, this procedure is irreversible.</p>
<p>Do you want to proceed?</p>
<p id="debug-url"></p>
</div>
<div class="modal-footer">
<a href="admin/catalog/information/delete/" class="btn danger">Yes</a>
<a href="#" data-dismiss="modal" class="btn secondary">No</a>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<?php }?>
<?php }?>
全视图
<?php echo $header;?>
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<div class="clearfix">
<div class="pull-left">
<h1 class="panel-title" style="padding-top: 7.5px;"><?php echo $heading_title;?></h1>
</div>
<div class="pull-right">
<a href="<?php echo base_url('admin/catalog/information/add');?>" role="button" class="btn btn-success">Add Information Page</a>
</div>
</div>
</div>
<div class="panel-body">
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<td>Information Title</td>
<td class="text-right">Delete</td>
<td class="text-right">Action</td>
</tr>
</thead>
<tbody>
<?php if ($informations) {?>
<?php foreach ($informations as $information) {?>
<tr>
<td><?php echo $information['title'];?></td>
<td class="text-right">
<a href="<?php echo $information['delete'];?>" class="btn btn-danger confirm-delete" data-id="<?php echo $information['information_id'];?>">Delete <?php echo $information['title'];?></a>
</td>
<td class="text-right">
<a href="<?php echo $information['edit'];?>" class="btn btn-primary">Edit <?php echo $information['title'];?></a>
</td>
</tr>
<?php }?>
<?php } else { ?>
<tr>
<td class="text-center" colspan="4">No Results</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
<div class="panel-footer">
</div>
</div><!-- .panel .panel-default -->
</div>
</div>
<?php if ($informations) {?>
<?php foreach ($informations as $information) {?>
<div class="modal fade" id="modal-from-dom">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>You are about to delete one track url, this procedure is irreversible.</p>
<p>Do you want to proceed?</p>
<p id="debug-url"></p>
</div>
<div class="modal-footer">
<a href="admin/catalog/information/delete/" class="btn danger">Yes</a>
<a href="#" data-dismiss="modal" class="btn secondary">No</a>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<?php }?>
<?php }?>
<script type="text/javascript">
$('#modal-from-dom').on('show', function() {
var id = $(this).data('id'),
removeBtn = $(this).find('.danger');
removeBtn.attr('href', removeBtn.attr('href').replace(/(&|'?)'d*/, '$1' + id));
$('#debug-url').html('Delete URL: <strong>' + removeBtn.attr('href') + '</strong>');
});
$('.confirm-delete').on('click', function(e) {
e.preventDefault();
var id = $(this).data('id');
$('#modal-from-dom').data('id', id).modal('show');
});
</script>
</div>
<?php echo $footer;?>
编辑:试试这个:
<script type="text/javascript">
$('#modal-from-dom').on('show', function() {
var id = $(this).data('id'),
removeBtn = $(this).find('.danger');
removeBtn.attr('href', removeBtn.attr('href').replace(/(&|'?)'d*/, '$1' + id));
$('#debug-url').html('Delete URL: <strong>' + removeBtn.attr('href') + '</strong>');
});
$('.confirm-delete').on('click', function(e) {
e.preventDefault();
var id = $(this).attr('data-id');
$('#modal-from-dom').data('id', id).modal('show');
});
</script>
仅在.confirm-delete
元素上使用var id = $(this).attr('data-id');
相关文章:
- 使用angularjs中的rest调用通过id获取数据
- javascript从id获取数字
- 如何通过ID获取图层对象
- 通过jstree中的Id获取节点
- 在控制器中按ID获取XML ViewElement(MultiInput)
- node.js使用monk从数组中按id获取文档
- 如何使用API从多个IMDB ID获取电影信息
- 我的ID获取元素不起作用
- 无法从IE中的data.responseText获取结果,但在其他浏览器中工作
- 如何通过 id 获取“this”元素并查看是否选中
- 使用类而不是 ID(通过 CLASS 而不是 ID 获取元素)
- 如何在Ember.js中使用jQuery通过id获取元素
- 使用类名按ID获取元素
- 使用 PHP 从 HTML 表中获取 DATA-ID HTML
- jQuery 通过元素的 data-id 获取元素
- Javascript - 获取对象的属性并使用“data-id”打印在元素上
- 使用data-status获取元素的id
- 循环遍历数组中的项目以分配 data-id,但仅获取数组中的最后一项
- Javascript无法获取data-id
- 如何在Jquery中获取data-id属性值