我有一个显示组名等的table
和一个显示成员列表的modal
。当我单击一个特定的组名时,将显示模式。.我在ajax的成功函数中设置了modal的值,但它不显示任何内容。.我也尝试在ajax的成功函数中进行alert(response)
警报未显示。
这是我的代码:
对于HTML表:
<div class="row table-responsive">
<table class="table table-bordered table-striped table-condensed" id="r_data">
<thead class="header">
<tr class="well">
<th style="font-size: 14px;">
Group Name
</th>
<th style="font-size: 14px;">
Leader's Name
</th>
</tr>
</thead>
<tbody>
<?php if($result != NULL){?>
<?php foreach($result as $row){?>
<tr>
<td data-toggle="modal" href="#viewMember" data-id="<?php echo $row->reservedID;?>">
<?php echo $row->groupName;?>
</td>
<td>
<?php echo $row->l_name.", ".$row->f_name." ".$row->m_name;?>
</td>
</tr>
<?php }?>
<?php }?>
</tbody>
</table>
这是模态:
<div class="container" >
<div class="row">
<div class="modal fade" id="viewMember" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-md">
<div class="modal-content"><!--CONTENT-->
<div class="form-horizontal"><!--Horizontal-->
<div class="modal-header"><!--HEADER-->
<button class="btn btn-primary close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 id="header"></h4>
</div><!--END of HEADER-->
<div class="modal-body"><!--BODY-->
<div class="welll">
<table class="table table-bordered table-striped table-condensed table-responsive" id="records_table">
<thead class="header">
<tr class="well">
<th>
Member's Name
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div><!--End of BODY-->
</div><!--END of Horizontal-->
</div><!--END of CONTENT-->
</div>
</div>
</div>
</div>
JS:
$('.viewMember').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
var id = button.data('id')
$.ajax({
url: "<?php echo base_url('admin/group/getMember')?>",
type: 'POST',
data: { 'groupID': id},
dataType: 'JSON',
success: function(result){
//alert("hi");
$('.modal-body #header').text(result[0].fname);
}
});
});
控制器:
public function getMember(){
$data = array();
$id = $_REQUEST['groupID'];
$this->load->model('group_model');
$data = $this->group_model->getAllMember($id);
echo json_encode($data);
}
参考方案
首先,我没有看到与此代码$('.modal-body #header')
匹配的html元素。所以现在,在显示输出方面,我对您的问题感到困惑。我假设您要显示在标题<h4 id="header"></h4>
中。如果是,则在成功块内更改您的jquery代码,如下所示:
$('.modal-header').find('#header').html(result[0].fname);
如果显示要显示输出的位置,则很容易进行jquery选择。
当<form>'.submit'函数被覆盖时(使用Ajax)将数据获取到php吗? - javascript我已覆盖此网页上表单的.submit函数,因为该网页已加载在“ index.php”中的#mainContent内,并且我希望“提交”按钮仅替换此#mainContent。我正在尝试将数据从此表单获取到.php文件,以便对数据库进行查询(或简单地回显已填充的变量,以指示已传递数据)。我是AJAX的新手。有人可以向我解释如何将数据传递到.php文件,或者指向要…
使用php重新加载内容 - javascript在对网站进行编程时,我以前使用过此代码,它可以完美工作,但是现在当我想使用一些Flash部件时,每次单击链接时,它都会重新加载所有网站。源代码: <!DOCTYPE html> <html> <head> <title>Hot King Staff</title> <meta charset=…
用jQuery填充模式形式 - javascript我正在将订单表从数据库绘制到datatables(jquery插件)中。我要在每笔最后一笔交易或每笔交易中增加付款。问题是,如何获取单击添加付款按钮以添加付款的行的订单ID。其次,当点击addpayment时,它会弹出一个带有字段或订单号的模态表单。我想用在td中找到的订单ID填充该字段,并使其不可编辑或隐藏,但在提交模态表单时将其发布到服务器。表格和模式表…
保留文本区域的数据或值,然后选择输入 - javascript通过$ _POST提交表单时,输入文件值仍然保留。像这样: if($_POST){ $error = false; if(!$post['price']){ $error = true; $error_note['price'] = "*Should not be empty"; } if($err…
混合码错误 - javascript好的,我在网站上为用户个人资料提供了一个基本的多合一页面,如下所示:<?php if($_GET['p']=='pb'){ echo '<p>pb</p>'; }elseif($_GET['p']=='example2'){ ec…