So I checked a lot of topics about this title but couldn't find a good answer to it.
So basically I have this table:
<div class="panel-body">
<div class="table-responsive">
<table class="table table-bordered tablesorter">
<thead>
<tr>
<th>Email <i class="fa fa-sort"></i></th>
<th>Akcje <i class="fa fa-sort"></i></th>
</tr>
</thead>
<tbody>
<?php
$subs = $conn->prepare("SELECT * FROM sub_permission WHERE id_bota=:id");
$subs->bindParam(":id",$ID);
$subs->execute();
?>
<form method="post">
<?php foreach($subs as $sub){ ?>
<tr>
<td>
<?php echo $sub['adminEmail']; ?>
</td>
<td>
<input type="hidden" name="id">
<button type="button" value="<?php echo $sub["adminEmail"]; ?>" class='btn btn-danger btn-xs' data-toggle="modal" data-target="#modal_DELETE" data-id="<?php echo $sub["adminEmail"]; ?>"> <span class="fa fa-times"> </span> </button><a> </a>
<button type="button" class='btn btn-warning btn-xs' data-toggle="modal" data-target="#myModalE"><span class="fa fa-edit"></span></button>
</td>
</tr>
<?php } ?>
</form>
</tbody>
</table>
</div>
</div>
So this is basically the table with users that have sub-admins and there's 1 action "Delete".
When someone clicks button delete, this modal will show:
<div class="modal fade" id="modal_DELETE" tabindex="-1" role="dialog" aria-labelledby="modal_nameDELETE">
<div class="modal-dialog" role="document">
<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" id="modal_nameDELETE">Sure?</h4>
</div>
<div class="modal-body">
Are you sure you want to remove sub-admin <label><?php echo $sub['adminEmail'];?></label> ?
<br>
</div>
<form method="post">
<div class="modal-footer">
<button type="submit" class="btn btn-default" data-dismiss="modal">No</button>
<button type="submit" class="btn btn-primary" name="delete">Yes</button>
</div>
</form>
</div>
</div>
</div>
The problem is when there's for example 3 people in the table and I click the delete button for user 3, the modal pops-up but the email is wrong.
Related
Im still learning PHP and Javascript. I display my cart item using modal but I don't have any idea how to disable the modal button if the displayed cart item is empty.
<div class="modal fade bd-example-modal-lg" id="cartmodal" tabindex="-1" data-target=".bd-example-modal-lg" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Lihat Bahan Arkib</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<table class="table table-secondary" id="cart_table" style="width: 100%;">
<thead class="">
<tr class="">
<th>No.Rujukan & No.Penerimaan</th>
<th>Tajuk</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody id='cartBody'>
<?php if (isset($_SESSION['cart'])) {
foreach($_SESSION['cart'] as $k => $v){ ?>
<tr id="view-cart">
<td><?php echo $v['id_arkib'] ?> </td>
<td><?php echo $v['tajuk']?> </td>
<td><button class="btn btn-danger mdi mdi-delete deleteitem" required>Padam</button></td>
</tr>
<?php }
}?>
</tbody>
</table>
</div>
<div class="modal-footer">
<a type="submit" class="btn btn-primary" id="btn-mohon-cart" name="mohonbtn" href="<?php echo ROOT_PATH; ?>pusat_sumber/penyelidik/permohonan_penyelidik.php">Mohon</a>
</div>
</div>
</div>
</div>
in javascript:
<button type="button" class="close" data-dismiss="modal" aria-label="Close" disabled={cart.length > 0 ? false : true}>
my view page
<!-- BEGIN PAGE -->
<div id="main-content">
<!-- BEGIN PAGE CONTAINER-->
<div class="container-fluid">
<!-- BEGIN PAGE HEADER-->
<div class="row-fluid">
<div class="span12">
<!-- BEGIN THEME CUSTOMIZER-->
<div id="theme-change" class="hidden-phone">
<i class="icon-cogs"></i>
</div>
<!-- END THEME CUSTOMIZER-->
<!-- BEGIN PAGE TITLE & BREADCRUMB-->
<h3 class="page-title">
contactus
<small> List </small>
</h3>
<ul class="breadcrumb">
<li>
<i class="icon-home"></i><span class="divider"> </span>
</li>
<li>
Dashboard<span class="divider"> </span>
</li>
<li>
contactus <span class="divider-last"> </span>
</li>
</ul>
<br /><br />
<div id="msg">
<?php
if($this->session->tempdata('success'))
{
?>
<div class="alert alert-success hide_msg pull" style="width: 95%"> <i class="fa fa-check-circle"></i> <?php echo $this->session->tempdata('success');?>
<button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span> </button>
</div>
<?php
}
if($this->session->tempdata('error'))
{
?>
<div class="alert alert-danger hide_msg pull" style="width: 95%"> <i class="fa fa-check-circle"></i> <?php echo $this->session->tempdata('error');?>
<button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span> </button>
</div>
<?php
}
?>
</div>
<!-- END PAGE TITLE & BREADCRUMB-->
</div>
</div>
<!-- END PAGE HEADER-->
<!-- BEGIN PAGE CONTENT-->
<div id="page" class="dashboard">
<div class="row-fluid">
<div class="span12">
<!-- BEGIN RECENT ORDERS PORTLET-->
<div class="widget">
<div class="widget-title">
<h4><i class="icon-reorder"></i> Contactus-List </h4>
<button class="btn btn-success" style="float:right"><i class="icon-plus icon-white"></i> EXCEL </button>
</div>
<div class="widget-body">
<!-- BEGIN Table-->
<table class="table table-striped table-advance table-hover" id="sample_1">
<thead>
<tr>
<th><i class="icon_profile"></i> S.No. </th>
<th> <i class="fa fa-picture-o" aria-hidden="true"></i> Date & Time </th>
<th><i class="icon_profile"></i> Name </th>
<th> <i class="fa fa-picture-o" aria-hidden="true"></i> Email </th>
<th> <i class="fa fa-picture-o" aria-hidden="true"></i> Mobile Number </th>
<th><i class="icon_mobile"></i> Message</th>
<th><i class="icon_cogs"></i> Action</th>
</tr>
</thead>
<tbody>
<?php
$i=1;
foreach($contactus as $e)
{
?>
<tr>
<td><?php echo $i++;?></td>
<td><?php echo $e->date_and_time;?></td>
<td><?php echo $e->name;?></td>
<td><?php echo $e->email;?></td>
<td><?php echo $e->mobile_no;?></td>
<td>
<?php
$string = strip_tags($e->message);
$stringCut = substr($string, 0, 15);
echo $stringCut."...";?> click to read more
</td>
<td><div class="btn-group">
<!--<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button> -->
<!-- <button class="btn btn-primary"><i class="icon-eye-open"></i></button>
<button class="btn btn-primary view" onclick="view_contact(this.value)" id="user_id" user_id="<?php echo $e->id;?>"><i class="icon-eye-open"></i></button>-->
<button class="btn btn-primary view_data" id="<?php echo $e->id; ?>" ><i class="icon-eye-open">VIEW FULL INFO</i></button>
<a onclick="return confirm('Are you want to delete ')" href="<?php echo base_url('admin/contactus_cont/delete_contactus')."/".$e->id;?>"> <button class="btn btn-danger"><i class="icon-trash icon-white"></i></button></a>
</div></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
</div>
<!-- END RECENT ORDERS PORTLET-->
</div>
</div>
</div>
<!-- END PAGE CONTENT-->
</div>
<!-- END PAGE CONTAINER-->
</div>
</div>
<!-- END CONTAINER -->
<div id="dataModal" class="modal fade">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">VIEW FULL INFO</h4>
</div>
<div class="modal-body" id="your_modal_detail">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('.view_data').click(function(){
var id = $(this).attr("id");
//alert(id);
$.ajax({
url : "<?php echo base_url('admin/contactus_cont/get_Full_data') ?>",
method:"POST",
data:{id:id},
success:function(data){
alert(data);
//console.log(data);
$('#your_modal_detail').html(data);
$('#dataModal').modal("show");
}
});
});
});
</script>
i want to view detail about each contact by AJAX & JQUERY
in this i am getting all contact data in list from database. But the problem is to show data in pop-up in datail.
like when i click on
it should display pop-up window with all detail by using particular ID close option
my controller function :-
public function get_Full_data()
{
$id = $this->input->post("id");
//echo $id; exit;
$data['fullData'] = $this->contactus_model->view($id);
$this->load->view('admin/datainModal',$data);
}
my model function :-
public function view($id)
{
$res = $this->db->get_where("contactus",array('id'=>$id));
return $res->row();
}
view page datainModal.php :-
<div class="table-responsive">
<table class="table table-bordered">
<div class='row col-md-12'>
<div class='col-md-6'>
<tr>
<td width="30%"><label>Id</label></td>
<td width="70%"><?php echo $fullData->id;?></td>
</tr>
</div>
<div class='col-md-6'>
<tr>
<td width="30%"><label>Data & Time</label></td>
<td width="70%"><?php echo $fullData->date_and_time;?></td>
</tr>
</div>
</div>
</table>
</div>
$(document).ready(function(){
$('.view_data').click(function(){
var id = $(this).attr("id");
console.log(id);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<button class="btn btn-primary view_data" id="1" >VIEW FULL INFO</button>
View Code:
<tr>
<td>
<button class="btn btn-primary view_data" id="<?php echo $e->id; ?>" ><i class="icon-eye-open">VIEW FULL INFO</i></button>
</td>
</tr>
Bootstrap Modal Code:-
<div id="dataModal" class="modal fade">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">VIEW FULL INFO</h4>
</div>
<div class="modal-body" id="your_modal_detail">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
JQUERY AJAX Code:-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('.view_data').click(function(){
var id = $(this).attr("id");
$.ajax({
url : "<?php echo base_url('ControllerName/get_Full_data') ?>",
type:"POST",
data:{id:id},
success:function(data){
//alert(data);
$('#your_modal_detail').html(data);
$('#dataModal').modal("show");
}
});
});
});
</script>
Controller Code:-
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class ControllerName extends CI_Controller {
public function get_Full_data(){
$id = $this->input->post("id");
$this->load->YourModelName();
$data['fullData'] = $this->YourModelName->getDatainModal($id);
$this->load->view('datainModal',$data);
}
}
?>
Modal Code:-
<?php
class YourModelName extends CI_Model {
function getDatainModal($id){
return $fullData = $this->db->get_where('table_name',array('id'=>$id))->row();
}
}
?>
Create in View datainModal.php :-
<div class="table-responsive">
<table class="table table-bordered">
<div class='row col-md-12'>
<div class='col-md-6'>
<tr>
<td width="30%"><label>Id</label></td>
<td width="70%"><?php echo $fullData->id;?></td>
</tr>
</div>
<div class='col-md-6'>
<tr>
<td width="30%"><label>Data & Time</label></td>
<td width="70%"><?php echo $fullData->date_and_time;?></td>
</tr>
</div>
</div>
</table>
</div>
in my project i have table(images). there is checkboxes column, when the user check record and press delete button record will be deleted. thats work fine.
then there is visible column(boolean) which is by default(true). So when record is checked and click hide/show button it will update visible value(from 1 to 0 or from 0 to 1)
My problem is that, delete and show/hide buttons work individually. i want both work at the same time. I don't know how combine them in the same table.
this is my view(in which only show/hide work)
<button type="submit" class="btn btn-danger" id="deleteImg"><i class="fa fa-trash"></i> Delete</button>
<form action="{{url('admin/images/hideimg')}}" method="post" class="form-inline">
{{csrf_field()}}
{{method_field('post')}}
<div class="pull-right form-group" style="padding: 12px">
<button class="btn btn-warning" id="hideImg">
Hide/Show</button>
</div>
#if($images)
<table class="table panel panel-default" id="table">
<thead class="panel-heading">
<tr>
<th><input type="checkbox" id="options"> </th>
<th>Visible?</th>
<th>photo</th>
<th></th>
</tr>
</thead>
<tbody id="tablecontents" class="panel-body">
#foreach($images as $image)
<tr class="row1" data-id="{{ $image->id }}">
<td><input class="checkboxes" type="checkbox" id="option" name="checkBoxArray[]" value="{{$image->id}}" data-imageid="{{$image->id}}"></td>
<td>{{$image->visible == 1?'yes':'no'}}</td>
<td ><img src="/uploads/{{$image->path}}" id="img" ></td>
<td>
</td>
</tr>
#endforeach
</tbody>
</table>
#endif
</form>
form action="delete/images" method="post" class="form-inline">
{{csrf_field()}}
{{method_field('delete')}}
<div class="modal fade" id="modalDelete" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
<div class="modal-dialog " role="document">
<div class="modal-content">
<div class="modal-header">
<h2 class="modal-title" style="text-align: center" id="modalLabel">Delete Confirmation</h2>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<h5 class="text-center">Are you sure you want to delete the following service?</h5>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-warning pull-left" data-dismiss="modal">
<span class='glyphicon glyphicon-remove'></span> Close</button>
<button type="submit" class="btn btn-danger" name="delete_all" value="Delete">
<span id="" class='glyphicon glyphicon-trash'></span> Delete</button>
</div>
</div>
</div>
</div>
</form>
Here. I have codeigniter update code, it also worked but the problem is when i click the Edit button did not parsing After space data.
(After space Words did not fetch in update model).
How can I solve this problem.
vvIncome.php view
$(document).on('click','.btn_edit', function(e) {
$("#edit").val($(this).attr('edit_id'));
$("#in_dis").val($(this).attr("in_dis"));
$("#in_amnt").val($(this).attr('in_amnt'));
$("#confirm-edit").modal({show:'true'});
});
$(document).on('click', '#btn-ys', function() {
var income_id = $('#edit').val();
var in_dis = $('#in_dis').val();
var in_amnt = $('#in_amnt').val();
var result{"income_id":income_id,"in_dis":in_dis,"in_amnt":in_amnt};
$.ajax({
data:result,
type: "POST",
url:'<?php echo base_url(); ?>admin/income/editincome/'+income_id,
success: function(data){
$("#confirm-edit").modal('hide');
viewData();
}
});
});
View PHP Code
<div class="modal fade bs-example-modal-md" id="confirm-edit" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
<div class="modal-dialog modal-md" role="document">
<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" id="myModalLabel">EDIT CATEGORY</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div class="well">
<form class="form-horizontal">
<div class="form-group">
<div class="col-md-12">
<input type="text"class="form-control" id="in_dis" placeholder="description">
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<input type="number" class="form-control" id="in_amnt" placeholder="amount">
</div>
</div>
<div class="form-group">
<div class="col-md-12">
<input type="hidden" class="form-control" id="edit" placeholder="income_id">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btn-ys" class="btn btn-success">SUBMIT</button>
</div>
</form>
</div>
</div>
</div>
</div>
`
Income_resut.php
<thead>
<tr>
<th ><center>DESCRIPTION</center></th>
<th ><center>AMOUNT</center></th>
<th ><center>EDIT</center></th>
<th ><center>DELETE</center></th>
</tr>
</thead>
<?php foreach ($incm as $in_key) { ?>
<tr>
<td><center><?php echo $in_key->description;?></center></td>
<td><center><?php echo $in_key->amount;?></center></td>
<td>
<center><button type="button" title="edit" data-toggle="modal" edit_id=<?php echo $in_key->income_id;?> in_dis=<?php echo $in_key->description;?> in_amnt=<?php echo $in_key->amount;?> class="btn btn-info btn_edit"><i class="fa fa-pencil"></i></button></center>
</td>
<td>
<center><button type="button" title="delete" data-toggle="modal" del_id=<?php echo $in_key->income_id;?> class="btn btn-danger btn-delete"><i class="fa fa-trash-o"></i></button></center>
</td>
<?php } ?>
</table>
`
income.php Controller
public function editincome($income_id)
{
$udata['income_id'] = $this->input->POST('income_id');
$udata['description'] = $this->input->POST('in_dis');
$udata['amount'] = $this->input->POST('in_amnt');
$update = $this->income_model>update_income_details($udata,$income_id);
}
Income_Model.php Model
public function update_income_details($udata,$income_id)
{
$this->db->from('income', $udata);
$this->db->where('income_id',$income_id );
return $this->db->update('income',$udata);
}
This on view table
enter image description here
This is edit model
enter image description here
Try changing to this,
for eg, in_dis=<?php echo $in_key->description;?> to data-in_dis="<?php echo rawurlencode($in_key->description); ?>"
then
$("#in_dis").val($(this).attr("in_dis")); to $("#in_dis").val(decodeURIComponent($(this).data("in_dis")));
Use .data() instead of .attr()
Let me know if it works for you.
Here is my screenshot of this modal, its showing but hiden
Could you please check the below line.where it append exactly(inside your modal content or outside).
actually it should be in outside of your modal content
<div class="modal-backdrop fade in"></div>
<div class="row-fluid sortable">
<div class="box span12">
<div class="box-header">
<h2><i class="halflings-icon align-justify"></i><span class="break"></span>Manage All Category</h2>
<div class="box-icon">
<i class="halflings-icon wrench"></i>
<i class="halflings-icon chevron-up"></i>
<i class="halflings-icon remove"></i>
</div>
</div>
<div class="box-content">
<div id="flash" style="display: none;">
<img style="margin: 15% 0 0 50%; position: absolute;" src="<?php echo base_url(); ?>admin/img/ajaxloader.gif"/>
</div>
<table class="table table-bordered table-striped table-condensed">
<thead>
<tr>
<th>Category ID</th>
<th>Category Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php if (isset($links)) {
foreach ($all_category as $category) { ?>
<tr>
<td><?php echo $category->category_id; ?></td>
<td class="center"><?php echo $category->category_name; ?></td>
<?php if ($category->status == 1) { ?>
<td class="center">
<a id="btnpublish" data-value="<?php echo $category->category_id; ?>" href="javascript:void(0);" class="label label-important">Unpublish</a>
</td>
<?php } else { ?>
<td class="center">
<a id="btnunpublish" data-value="<?php echo $category->category_id; ?>" href="javascript:void(0);" class="label label-success">Publish</a>
</td>
<?php } ?>
<td class="center">
<a class="btn btn-small btn-inverse" href="#" data-toggle="modal" data-target="#myModal<?php echo $category->category_id; ?>">View</a>
<a class="btn btn-small btn-info" href="#">Edit</a>
<a id="deleteCat" class="btn btn-small btn-danger" data-value="<?php echo $category->category_id; ?>" href="javascript:void(0);">Delete</a>
<!--Start View Modal-->
<div class="modal fade" id="myModal<?php echo $category->category_id; ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel<?php echo $category->category_id; ?>">
<div class="modal-dialog" role="document">
<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" id="myModalLabel<?php echo $category->category_id; ?>">Category View</h4>
</div>
<div class="modal-body">
<p><b>Category ID:</b> <?php echo $category->category_id; ?></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!--End View Modal-->
</td>
</tr>
<?php }
} ?>
</tbody>
</table>
<div class="pagination pagination-centered">
<?php echo $links; ?>
</div>
</div>
</div><!--/span-->
</div>
Which version of Bootstrap are you using?
There was a ticket for that on GH in an earlier version of Bootstrap.
https://github.com/twbs/bootstrap/issues/16148
Every thing is good just one thing...put modal div outside to the td of the table, keep it inside body but out side to the table.
Modal is not displaying because you are repeating modal with same id of the modal in for each loop(like buttons are repeating).
I have answered this the way you can achieve it at link below.
dynamically created bootstrap3 modals do not work