How to display php mysql select value in popup - php

i want to pass mysql select value (UID) to css popup.this is my code what I have tried.but it's display empty textbox.this pop up button display when click on delete button.i want to pass relavent user UID to popup.
<table class="table table-striped table-bordered responsive">
<thead>
<tr>
<th>User ID</th>
<th>Facebook ID</th>
<th>Name</th>
<th>E-mail</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<?php
$query = 'SELECT * FROM Users ';
$result = mysql_query($query);
while($row = mysql_fetch_assoc($result))
{
echo '<tr>';
echo '<td>'.$row['UID'].'</td>';
echo '<td class="center">'.$row['Fuid'].'</td>';
echo '<td class="center">'.$row['Ffname'].'</td>';
echo '<td class="center">'.$row['Femail'].'</td>';
echo '<td>'.'<a href="#" class="btn btn-info btn-setting" >'.'Delete'.'</a>'.'</td>';
echo '</tr>';
}
?>
</tr>
</tbody>
</table>
<form action="db_sql/db_delete_supplier.php" method="post" name="frm1" id="frm1" >
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h3>Delete Supplier</h3>
</div>
<div class="modal-body">
<p>Are you sure to delete this supplier from system ...? </p>
</div>
<div class="modal-footer">
<input type="text" name="UID" value="<?php echo $row['UID'];?>" />
<!--Close
Delete-->
<input type="submit" class="btn btn-default" name="no" value="Close" />
<input type="submit" class="btn btn-primary" name="yes" value="Delete"/>
</div>
</div>
</div>
</div>
</form>

<?php echo "Edit"; ?>
Put this code in While loop , so this will open pop-up windows with query-string of cat-id.
Now from that ID you can fetch all records in pop-up.
This is possible solution you can do....
Note : you can pass any ID which is unique so that you can execute select query on pop-up page and it will fetch data from database

Related

Can I edit bootstrap modal without using JS/Ajax?

I am basically performing CRUD operation, in which I'm adding the data from modal which successfully added as well as fetching successfully but I want to edit there is a problem to get the id. I want to do this without using JS/AJAX, is it possible to edit the record in a bootstrap modal?
list page start, where data fetching from DB
<div class="table-responsive table-responsive-data2">
<table class="table table-data2">
<thead>
<tr class="bg bg-success">
<th class="text-center">Sr#</th>
<th class="text-center">Room Name</th>
<th class="text-center">Status</th>
<th class="text-center">Actions</th>
</tr>
</thead>
<tbody>';
//-----------------------------------------------------
$sql = $conn->query("SELECT * FROM rooms");
$srno = 0;
//-----------------------------------------------------
while($values = mysqli_fetch_array($sql)) {
//-----------------------------------------------------
$srno++;
//-----------------------------------------------------
echo '
<tr class="tr-shadow">
<td>'.$srno.'</td>
<td>'.$values['room_name'].'</td>
<td>';
if($values['room_status'] == 1)
{
echo'<span class="status bg bg-info">Active</span>';
}
else if($values['room_status'] == 2){
echo'<span class="status bg bg-danger">Inactive</span>';
}
echo "id:".$id = $values['room_id'];
echo'
</td>
<td>
<input type="text" name="id" value="'.$values['room_id'].'">
<div class="table-data-feature">
<button class="item" data-toggle="modal" data-target="#update_room" data-id="'.$values['room_id'].'">
<i class="zmdi zmdi-edit"></i>
</button>
</div>
</td>
</tr>
<tr class="spacer"></tr>';
}
echo'
</tbody>
</table>
</div>
list page end
Modal start, to edit the record
<?php
//-----------------------------------------------------
$sql = $conn->query("SELECT * FROM rooms WHERE room_id ='".$_GET['id']."'");
$srno = 0;
//-----------------------------------------------------
($values = mysqli_fetch_array($sql));
echo'
<div class="modal fade" id="update_room" tabindex="-1" role="dialog" aria-labelledby="mediumModalLabel" aria-hidden="true">
<div class="modal-dialog modal-md" role="document">
<div class="modal-content">
<div class="modal-header bg bg-success">
<h4 class="modal-title text-white" id="mediumModalLabel"><i class="fa fa-plus"></i> Add Room </h4>
<button type="button" class="close text-white" data-dismiss="modal" aria-label="Close" >
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body mt-lg">
<form action="#" class="form-horizontal" id="form" enctype="multipart/form-data" method="post" accept-charset="utf-8">
<input type="text" name="room_id" id="room_id" value="id:'.$_GET['id'].'">
<div class="form-group">
<div class="col-md-12">
<label class="control-label">Room Name <span class="required">*</span></label>
<input type="text" class="form-control" required name="room_name" value="'.$values['room_name'].'"/>
</div>
</div>
<div class="form-group" >
<div class="col-md-12">
<label class="control-label">Status <span class="required">*</span></label>
<div class="radio-inline">
<input type="radio" name="room_status" value="1" ';
if($values['room_status'] == 1)
{echo'checked'; }echo'>
<label for="">Active</label>
<input type="radio" name="room_status" value="2" '; if($values['room_status'] == 2) {echo'checked'; }echo'>
<label for="">Inactive</label>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary" name="submit_room">Submit</button>
</div>
</form>
</div>
</div>
</div>
';
?>
modal end
Well, If you don't want to use ajax you have to submit a form to your bootstrap modal data Into a page and get them with get or post method and include them in php.
Like THis:
list page:
<form method="post" action="modal.php">
<!-- Your List page code --->
<!-- Input for your data --->
<input name="data">
<!-- a submit button --->
<button type="submit">submit</buttton>
</form>
modal Page:
//get data from list page
$data = $_POST["data"];
//Your Codes and data in your modal body

Can not delete data from MySQL using bootstrap Modal

I have a PHP file manage-users.php which contains bootstrap Data-table. Which shows data from MySQL users Table .
code of Data-table is :
<table id="myTable" class="table table-striped table-hover">
<thead>
<tr>
<th>
<span class="custom-checkbox">
<input type="checkbox" id="selectAll">
<label for="selectAll"></label>
</span>
</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Phone</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<?php
$result = mysqli_query($conn,"SELECT * FROM users") or die("Unable to qet all users data " . mysqli_error($conn));
while ($row = mysqli_fetch_assoc($result)) {
echo "<tr>";
echo '<td>
<span class="custom-checkbox">
<input type="checkbox" id="checkbox1" name="options[]" value="1">
<label for="checkbox1"></label>
</span>
</td>';
echo "<td>".$row['FIRST_NAME']."</td>";
echo "<td>".$row['LAST_NAME']."</td>";
echo "<td>".$row['EMAIL']."</td>";
echo "<td>".$row['PHONE']."</td>";
echo '
<td>
<i class="material-icons" data-toggle="tooltip" title="Edit"></i>
<i class="material-icons" data-toggle="tooltip" title="Delete"></i>
</td>
';
echo "</tr>";
}
?>
</tbody>
</table>
In the same page, I have two bootstrap modals to delete and edit data .
I'm working on Delete now.
Delete Modal Code is :
<div id="deleteEmployeeModal<?php echo $row['USER_ID']; ?>" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<form>
<div class="modal-header">
<h4 class="modal-title">Delete User</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<p>Are you sure you want to delete these Records?</p>
<p class="text-warning"><small>This action cannot be undone.</small></p>
</div>
<div class="modal-footer">
<input type="button" class="btn btn-default" data-dismiss="modal" value="Cancel">
<button class="btn btn-danger">Delete</button>
</div>
</form>
</div>
</div>
</div>
Now the problem is that, that i can not delete data because in Delete Modal the $row['USER_ID] is empty. there is no problem in retrieving data from the server because the $row['USER_ID] is showing showing on every user specific delete button. what should i do now ?
If question needs more explanation, i'll explain.
Upon opening the modal, you basically set a hidden field so that when you submit the form, it will send delete_user_data.php?id=YOUR-VALUE.
1) Store the ID in the HTML. A good place might be the link that opens the modal. Also, remove data-toggle attribute because we will be opening the modal dynamically.
echo '<i class="material-icons" data-toggle="tooltip" title="Delete"></i>';
2) Only use one modal for deleting.
<div id="deleteEmployeeModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<!-- give your form an action and method -->
<form action="delete_user_data.php" method="GET">
<div class="modal-header">
<h4 class="modal-title">Delete User</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
<p>Are you sure you want to delete these Records?</p>
<p class="text-warning"><small>This action cannot be undone.</small></p>
</div>
<div class="modal-footer">
<!-- add a hidden input field to store ID for next step -->
<input type="hidden" name="id" value="" />
<input type="button" class="btn btn-default" data-dismiss="modal" value="Cancel">
<!-- change your delete link to a submit button -->
<button class="btn btn-danger" type="submit">Delete</button>
</div>
</form>
</div>
</div>
</div>
3) Open the modal dynamically.
$(function () {
$('a.delete').click(function (e) {
e.preventDefault();
var link = this;
var deleteModal = $("#deleteEmployeeModal");
// store the ID inside the modal's form
deleteModal.find('input[name=id]').val(link.dataset.id);
// open modal
deleteModal.modal();
});
});
Use similar approach for doing the Edit modal.

Load different data in popup on buttotn click for different rows

I have a table which shows multiple rows data taken from database.
There is one button in every row. So what i want, when i click on the button it should be show a popup and data would be shown of that particular row.
for example, when i click on button on the first row, popup with the data of first row will be shown.if i click the button on second row, the data of second row will be shown.
The problem is, when i click on the button of the first row or second row i am getting the same data in the popup of two different row.
so, how can i get the different data in every popup related to different rows?
This my code of view in which i have taken value from controller and shown
CONTROLLER
public function get_job()
{
$data['result'] = $this->user_model->view_job();
if (!empty($data['result']))
{
$this->load->view('admin_view',$data);
}
else
{
$email = $_SESSION['email'];
$data['result'] = $this->user_model->get_username($email);
$this->load->view('no_job',$data);
}
}
MODEL
//To get recently added jobs by inner join
public function view_job()
{
$this->db->select('add_job.*, crm_accounts.company');
$this->db->from('add_job');
$this->db->join('crm_accounts', 'add_job.cid = crm_accounts.id', 'inner');
$this->db->where('add_job.status', 'NEW');
$query = $this->db->get();
return $query->result_array();
}
VIEW
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Id</th>
<th>Job Id</th>
<th>Job Name</th>
<th>Company Name</th>
<th>Company Id</th>
<th>More</th>
</tr>
</thead>
<tbody>
<tr>
<?php
foreach ($result as $object)
{
?>
<td><?php echo $object['id']?></td>
<td><?php echo $object['job_id']?></td>
<td><?php echo $object['job_name']?></td>
<td><?php echo $object['company']?></td>
<td><?php echo $object['cid']?></td>
<td>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal">
Details
</button>
</td>
</tr>
<div id="MyModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-title"><h3>Company Name :<?php echo $object['company']?></h3></div>
</div>
<div class="modal-body">
<h3>Id: <?php echo $object['id']?></h3>
<h3>Job Name: <?php echo $object['job_name']?></h3>
<h3>Job Id: <?php echo $object['job_id']?></h3>
<h3>Paper Size: <?php echo $object['paper_size']?></h3>
<h3>Paper Type: <?php echo $object['paper_type']?></h3>
<h3>Cutting Size: <?php echo $object['cutting_size']?></h3>
<h3>Sheet: <?php echo $object['sheet']?></h3>
<h3>Lamination: <?php echo $object['lamination']?></h3>
<h3>Print Type: <?php echo $object['print_type']?></h3>
<h3>Ctp By: <?php echo $object['ctp_by']?></h3>
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
<button type="button" name="accepted" value="accept" class="btn btn-success">Accept Job</button>
</form>
<button type="button" class="btn btn-danger" data-dismiss="modal">Reject Job</button>
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
<?php } ?>
</div>
</div>
</div>
</td>
</tbody>
</table>
Reason for same modal is opening each time you click on different row's button is the same ID of each modal. What you need to do is change the data-target of modal to be different for each row. To do this append counter or the ID or the row after the DIV ID of the modal.
Like this,
Your button code will look something like this,
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal<?php echo $object['id']?>">
Details
</button>
And code of Modal will look something like this,
<div id="MyModal<?php echo $object['id']?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-title">
<h3>Company Name :<?php echo $object['company']?></h3>
</div>
</div>
<div class="modal-body">
<h3>Id: <?php echo $object['id']?></h3>
<h3>Job Name: <?php echo $object['job_name']?></h3>
<h3>Job Id: <?php echo $object['job_id']?></h3>
<h3>Paper Size: <?php echo $object['paper_size']?></h3>
<h3>Paper Type: <?php echo $object['paper_type']?></h3>
<h3>Cutting Size: <?php echo $object['cutting_size']?></h3>
<h3>Sheet: <?php echo $object['sheet']?></h3>
<h3>Lamination: <?php echo $object['lamination']?></h3>
<h3>Print Type: <?php echo $object['print_type']?></h3>
<h3>Ctp By: <?php echo $object['ctp_by']?></h3>
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
<button type="button" name="accepted" value="accept" class="btn btn-success">Accept Job</button>
</form>
<button type="button" class="btn btn-danger" data-dismiss="modal">Reject Job</button>
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
<?php } ?>
</div>
</div>
</div>
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Id</th>
<th>Job Id</th>
<th>Job Name</th>
<th>Company Name</th>
<th>Company Id</th>
<th>More</th>
</tr>
</thead>
<tbody>
<tr>
<?php
foreach ($result as $object)
{
?>
<td><?php echo $object['id']?></td>
<td><?php echo $object['job_id']?></td>
<td><?php echo $object['job_name']?></td>
<td><?php echo $object['company']?></td>
<td><?php echo $object['cid']?></td>
<td>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal_<?php echo $object['id']?>">
Details
</button>
</td>
</tr>
<div id="MyModal_<?php echo $object['id']?>" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-title"><h3>Company Name :<?php echo $object['company']?></h3></div>
</div>
<div class="modal-body">
<h3>Id: <?php echo $object['id']?></h3>
<h3>Job Name: <?php echo $object['job_name']?></h3>
<h3>Job Id: <?php echo $object['job_id']?></h3>
<h3>Paper Size: <?php echo $object['paper_size']?></h3>
<h3>Paper Type: <?php echo $object['paper_type']?></h3>
<h3>Cutting Size: <?php echo $object['cutting_size']?></h3>
<h3>Sheet: <?php echo $object['sheet']?></h3>
<h3>Lamination: <?php echo $object['lamination']?></h3>
<h3>Print Type: <?php echo $object['print_type']?></h3>
<h3>Ctp By: <?php echo $object['ctp_by']?></h3>
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
<button type="button" name="accepted" value="accept" class="btn btn-success">Accept Job</button>
</form>
<button type="button" class="btn btn-danger" data-dismiss="modal">Reject Job</button>
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
<?php } ?>
</div>
</div>
</div>
</td>
</tbody>
</table>
Try this code. i thing. you problem will resolved.

edit value in using model box

i want to edit table row using bootstrap model....when i click on edit button it open up a model box with a name of designttion which i want to edit
..but when when i click on button only modalbox show but no record is shown in it...
please solve my problem
Controller
public function edit_desig(){
$this->load->model('designation_model');
$this->designation_model->edit_designation($id);
}
model
public function edit_designation($id){
$query=$this->db->get_where('designation',array('desig_id'=>$id));
return $query->result();
}
My view
<div id="myModal" class="modal fade" id="editdesigymodal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Edit Designation</h4>
</div>
<div class="modal-body">
<input id="editdesignnation" type="text" class="form-control" placeholder="Enter here" />
</div>
<div class="modal-footer">
<button type="button" onclick="edit_designation()" class="btn btn-success" data-dismiss="modal">Edit</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-12 col-sm-12">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>#</th>
<th>Designations</th>
</tr>
</thead>
<tbody>
<?php print_r($designation); $i=1;foreach($designation as $desig): ?>
<tr>
<td><?php echo $i; ?></td>
<td><?php echo $desig['name']; ?></td>
<td><input type="button" value="Delete" class="btn btn-danger"/>
<td class="numeric"><a id= "<?php echo $desig['dkey']; ?>" onclick="edit_designation('<?php echo $desig['dkey']; ?>')" data-target="#myModal" data-toggle="modal" href="<?php echo base_url().'index.php/designation/edit_desig'; ?>"><button class="btn blue" type="button">Edit</button>
</tr>
<?php $i++;endforeach;?>
You need to pass your query result to your view
Controller
public function edit_desig(){
$this->load->model('designation_model');
$designation=$this->designation_model->edit_designation($id);// assing your query result to your variable
$data['designation'] = designation;// pas your variavle to data arrray
$this->load->view('view_name', $data);// load your view with array
}
As per your view code you need to fetch data in array form in your model
Models
public function edit_designation($id){
$query=$this->db->get_where('designation',array('desig_id'=>$id));
return $query->result_array();// change this to array
}

Copying values from a table row to a modal

I have wrote an HTML table presenting users' information from an SQL database.
<table class="table table-hover">
<tr>
<th>Username</th>
<th>Password</th>
<th>Role</th>>
<th>Attribute</th>
</th>
<th>Ideas/Score</th>
<th>Edit</th>
<th>Delete</th>
</tr>
<?php while($result=m ysqli_fetch_array($fetch)) { $usertoattrquery="SELECT * FROM usertoattr WHERE usertoattr.user_id=" .$result[user_id]; $attrfetch=mysqli_query($con,$usertoattrquery) or die ( 'could no connect with instructions'); echo "<tr><td>".$result[ "username"]. "</td><td>" .$result[ "password"]. "</td>
<td>" .$result[ "role"]. "</td><td>only for Eval</td><td>coming soon</td><td>
<a href='#editUser' role='button' class='btn' data-toggle='modal'>Edit</a> </td>
<td><button class='btn'onclick='deleteConfirm()'>Delete</button> </td></tr>"; } ?>
</table>
I would like when someone pushes the button "Edit" in a specific row a Modal to be opened and the values from this table row to be copied (for example name and password) inside the modal.
<div id="editUser" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<h3 id="myModalLabel">Edit User</h3>
User Name
<input type="text">
<br>User Password
<input type="text">
<br>User Role
<select>
<option>Evaluator</option>
<option>Observer</option>
</select>
<br>User Attribute
<select multiple>
<option>Economics</option>
<option>Software</option>
<option>Management</option>
</select>
<br>
<button class='btn btn-primary'>OK</button>
<button class='btn' data-dismiss="modal" aria-hidden="true">Cancel</button>
</div>
How is that possible?
You could possibly add an id to each of your <td> (just make sure each one is different multiple id's are bad!!)
Then have your javascript use that value (.innerHTML) to set the value of your input text inside your modal.

Categories