I'm trying to write a modal dialog that should display a field of my SQL query result for example I'll run
select * from users where salary IS NULL;
I want to create a button with the users who have no salary set
I should be getting
adel
ahmed
as buttons on the modal dialog
here's my code:
if ($rows > 0) {
echo "some employees have not been assigned an hourly rate yet"; ?>
<br> <input class="btn btn-primary" type="button" value="set salaries" data-toggle="modal" data-target="#salaryModal"/>
<div class="modal fade" id="salaryModal" >
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="form-group ">
<?php while($row = mysqli_fetch_assoc($auth)) {
$username = $row["username"]; ?>
<input class="btn btn-success" onclick="sayHello()" id="calculate_salary_button" value="<?php echo $username;} ?>"/></a> <br>
</div>
<?php } } ?>
outside the modal dialog, I echo the usernames coorectly, here however I get one button:
adel
You got a } in your
value="<?php echo $username;} ?>"
Which ends the while loop after the first run.
And your input fields ID's must be unique
Related
I want to achieve after selecting in my select tag, it will display a input tag in my modal and that has been fetch in other table in database.
totalfees.php
if(isset($_POST["year"]))
{
$output = '';
$query = "SELECT total_fees FROM manage_fees WHERE year_lvl = '".$_POST["year"]."'";
$result = mysqli_query($connect, $query);
while($row = mysqli_fetch_array($result))
{
$output .= '
<input type="text" class="form-control" id="tf" name="tf" readonly="readonly" value="'.$row["total_fees"].'">
';
}
echo $output;
}
gettotal.js
$(document).ready(function(){
$('#year').click(function(){
var year = $(this).attr("year");
$.ajax({
url:"../include/assessment.php",
method:"post",
data:{year:year},
success:function(data){
$('#total_fees').html(data);
}
});
});
assessment.php
<div class="modal fade" id="fee_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Assess Student</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form method="POST" action="officer_studentAssessment.php" id="reg">
<div class="form-group">
<label for="year">Year</label>
<select class="form-control" id="year" name="year" required>
<?php
$result = $connect->query("SELECT * FROM year_lvl") or die($connect->error());
while($row = $result->fetch_assoc()):
?>
<option value="<?php echo $row['year']; ?>"><?php echo $row["year"]; ?></option>
<?php endwhile; ?>
</select>
</div>
<div class="form-group" id="total_fees">
<label for="tf">Total fees</label>
</div>
<div class="modal-footer">
<button class="btn btn-success" name="create" id="create" type="submit">Create</button>
</div>
</form>
</div>
</div>
</div>
</div>
in totalfees.php the output should be display on the DIV tag where id = total_fees, the problem is after I click the select tag the DIV disappears
<div class="form-group" id="total_fees">
<label for="tf">Total fees</label>
</div>
add
<scritp>
let selectval = document.getElementById('selectId');
let val =document.getElementById('yourId');
let val.value = selectval
</script>
in slectId add id of your select input and in yourId add id of input field where you would like to add the data
Looks like a wrong-word typo.
In gettotal.js, in your ajax code block, you are calling out to the wrong url.
Instead of:
url:"../include/assessment.php",
try:
url:"../include/totalfees.php",
Also, you might want to change:
$('#year').click(function(){
to
$('#year').change(function(){
My problem is I am trying to call the PHP file while clicking the button on my bootstrap but it is not working for me here by I paste my code of bootstrap and PHP kindly guide me for the solution
Thanks in advance
I am tired of changing button to form and all of these but not working I am working on PHP 7 and Bootstrap 4
<?php include "includes/db.php"; ?>
<?php
// echo "<h1> Testing </h1>";
// $db = mysql_select_db("cateory", $connection); // Selecting Database from Server
function(){
if (isset($POST['submit'])){
// $connect=mysqli_query($connection,)
$cat_title=$POST['cat_title'];
if($cat_title==""||empty($cat_title)){
echo "The field should not empty";
}
else{
$query="INSERT INTO category (cat_title)";
$query .=" VALUE ('{$cat_title}')";
$create_category_query = mysqli_query ($connection,$query);
if(!$create_category_query){
die ('QUERY FAILED'.mysqli_error($connection));
}
}
}
}
?>```
<!-- ADD CATEGORY MODAL -->
<div class="modal fade" id="addCategoryModal">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header bg-success text-white">
<h5 class="modal-title">Add Category</h5>
<button class="close" data-dismiss="modal">
<span>×</span>
</button>
</div>
<div class="modal-body">
<form action="" method="post">
<div class="form-group">
<label for="title">Title</label>
<input type="text" class="form-control" name="title">
</div>
</div>
<div class="modal-footer">
<?php insert_categories(); ?>
<button class="btn btn-success" type="submit" data-dismiss="modal">Save Changes</button>```
</div>
</form>
</div>
</div>
Do change your code like:
<?php
if ( isset( $_POST['submit']) ) {
// $connect=mysqli_query($connection,)
$cat_title = $_POST['cat_title'];
if($cat_title==""||empty($cat_title)){
echo "The field should not empty";
} else {
$query="INSERT INTO category (cat_title)";
$query .= " VALUE ('{$cat_title}')";
$create_category_query = mysqli_query ($connection,$query);
if(!$create_category_query){
die ('QUERY FAILED'.mysqli_error($connection));
}
}
}
?>
<!-- ADD CATEGORY MODAL -->
<div class="modal fade" id="addCategoryModal">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header bg-success text-white">
<h5 class="modal-title">Add Category</h5>
<button class="close" data-dismiss="modal">
<span>×</span>
</button>
</div>
<div class="modal-body">
<form action="" method="post">
<div class="form-group">
<label for="title">Title</label>
<input type="text" class="form-control" name="cat_title">
</div>
<div class="modal-footer">
<?php insert_categories(); ?>
<button class="btn btn-success" type="submit" data-dismiss="modal">Save Changes</button>```
</div>
</form>
</div>
</div>
</div>
</div>
Problems with your code:
Your HTML formatting itself is wrong. you have broken your form tag with div of modal-body. You have to reconsider your HTML design.
No need to wrap PHP code in a function with no name.
You just have to use the code only.
You have named your input as title while saving/checking data as cat_title.
Check your whole codebase again.
I want to pass the id value of student in the modal form. When I clicked the button 1stgrade, here is my table code:
<tbody>
<?php
require_once '../dbconfig.php';
$stmt = $db_con->prepare("SELECT * FROM userinfo WHERE role='student' AND gradelvl='7' AND sectionname='$_POST[table7]' ORDER BY lrnno ASC");
$stmt->execute();
while($row=$stmt->fetch(PDO::FETCH_ASSOC))
{
?>
<tr>
<td><?php echo $row['fname']; ?></td>
and this is my modal form:
<td>
<div align="center">
<form action="studentprofilegradeaction.php" method="POST" class="form-horizontal">
<input type='text' name='id' value='<?php echo $row['id']; ?>' />
<!-- Button HTML (to Trigger Modal) -->
<i class="fa fa-building"></i>1st
<!-- Modal HTML -->
<div id="1stgrade7" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<input type='text' value='<?php echo $row['id'] ?>' />
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h2 class="modal-title">Please Fill Correctly</h2>
</div>
<div class="modal-header">
<h4 class="modal-title">1st Grading Result </h4>
</div>
<div class="modal-body">
<div align="left">
<b>Filipino:</b>
<input type="text" class="form-control" name="c71stgfilipino" >
</div>
I want to pass the id number to modal 1stgrade.
Replace your anchor tag:
<i class="fa fa-building"></i>1st
=>
<a id="openModal" data-id="<?php echo $row['id']; ?>" class="btn btn-info"><i class="fa fa-building"></i>1st</a>
Remove other unnecessary code from your while loop, keep modal code outside the loop and give id to your id input inside modal:
<input id="userId" type='text' value='<?php echo $row['id'] ?>' />
Then you need jquery to read the od of clicked row and set it to modal write this after :
<script>
$(document).ready(function() {
$("#openModal").click(function() {
//remove previous value
$("#userId").val("");
//this ll set id to your modal input
$("#userId").val($(this).attr("data-id"));
//open the modal
$("#1stgrade7").modal("show");
});
});
</script>
I have displayed some values from database in form of a table using php. One column of the table is reserved for edit. I wish that each row of the table can be edited.
Code for edit is
echo"<td class='success'><button class='btn blue' data-toggle='modal' data-target='#myeditModal'>Edit </button></td>";
Code used in modal is
<div class="modal fade" id="myeditModal" 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"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Edut Treatment</h4>
</div>
<div class="modal-body">
<form class="form-horizontal" role="form" action="edit.php?id="$row['id']"" enctype="multipart/form-data" method="post">
<div class="form-group">
<label class="col-lg-4 control-label"> Name</label>
<div class="col-lg-6">
<input class="form-control" value="" type="text" name="name" >
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label"></label>
<div class="col-md-8">
<input class="btn btn-primary" value="Save Changes" type="submit" name="submit">
<span></span>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
Code for edit.php page is
<?php
include('admin_session.php');
$con=mysqli_connect("localhost","root","","db");
// Check connection
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$id = $_GET['id'];
mysqli_query($con,"UPDATE treatment_type SET name='".$name.'" WHERE id='".$id."'");
mysqli_close($con);
header("Location: abc.php");
?>
My problem is that when I reach the edit.php page I get the url as this: http://example.com/xyz/edit.php?id=
I am not able to carry the id due to which I am not able to edit a specific row of the table.
If you are enable to call the URL just fine. Most likely because of this line on the UPDATE statement:
WHERE id='".$id."'");
^^^^^^^
Second, properly echo the row id:
action="edit.php?id=<?php echo $row['id']; ?>"
And make sure $name is defined.
And why not use prepared statements instead:
if(isset($_GET['id'], $_GET['name'])) {
mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
$con = mysqli_connect("localhost","root","","db");
$id = $_GET['id'];
$name = $_GET['name'];
$sql = 'UPDATE treatment_type SET name = ? WHERE id = ?';
$update = $con->prepare($sql);
$update->bind_param('si', $name, $id);
$update->execute();
if($update->affected_rows > 0) {
header("Location: abc.php");
} else {
echo 'did not update';
}
}
The way you have it now, you need to change to this..
<form class="form-horizontal" role="form" action="edit.php?id='<?php echo $row['id'];?>'" enctype="multipart/form-data" method="post">
To output the ID corerectly into the form.
But this way you are ouputting multiple different modal forms for each row??
You should really just display the modal once, then pass the ID via jquery/javascript to the modal, do an ajax request-display the data, and then edit it.
If its just one row, it should be fine, But if you want multiple table rows, with the ability to edit any value in the row, then you definitely need to use ajax/jquery/javascript
Example using one modal window, and passing ID via jquery...
PHP
echo"<td class='success'><button class='btn blue editButton' data-id='<?php echo $row['id'];?>' >Edit </button></td>";
Jquery
$(document).ready(function(){
//Click button, apply id, and open modal.
$('.editButton').click(function(){
var id = $(this).data('id');
//Apply action with id to form
$('#myForm').attr('action','edit.php?id='+id);
//Open modal
$('#myModal').modal({background:'static'});
}):
//If you want values to come into the modal you need to do a sepereate ajax call to get the one particular element from database.
});
I will try to be as clear as I can.
I'm creating a simple example page where employee can review there age.
On the page user have the choice to click on a button to change there age.
The page load the age from a use in a Database.
So I select from the table employee the age matching the $name value.
<?php
$query = "SELECT * FROM employee";
$rs = mysql_query($query);
while ($row = mysql_fetch_assoc($rs)) {
echo "Name " . $row['name'] . "<br/>Age " . $row['age'] . "<br/>";
}
?>
Under that I have a bootstrap modal button so the employee can click and update there age.
<div id="myModal" class="modal fade" 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" aria-hidden="true">x</button>
<h4 class="modal-title" id="myModalLabel">Change your age</h4>
</div>
<div class="modal-body">
<?php
$name = "Mathieu";
$query = sprintf("SELECT age From employee Where name = '%s'",
mysql_real_escape_string($name));
$rs = mysql_query($query);
while ($row = mysql_fetch_object($rs)) {
$age = $row->age;
}
?>
<form action="update.php" method="post"class="form-inline">
<input class="form-control" id="disabledInput" type="text" placeholder="<?php echo $name; ?>" disabled>
<br/><br/>
<input type="text" class="form-control" placeholder="<?php echo $age; ?>" value="<?php echo $age; ?>">
<br/><br/>
<button type="submit" class="processing btn">Update</button>
</form>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<div class="bs-example" style="padding-bottom: 24px;">
<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Update your age</a>
</div>
I have 2 problem.
1. What is the best way to update the value in my database then close the modal.
2. How do I refresh my page without a reload.
I did some trial and error but nothing work at all.
The best way for me to update the value from the database without reloading is
that you should be using a Live Edit Using Jquery & ajax hope this helps.
use
header("Location: index.php");