I have searched for hours now to find out how I could do this, but unfortunately all to no avail.
I am trying to send entered information so it can run through MySQL and obtain the information, then echo it in table on screen.
The issue (as far as I can tell) must be with my JQuery code:
$("#btnCheckNoteIDs").click(function(){
var noteUser = $("#noteUser").val();
var noteDate = $("#noteDate").val();
$("#LoadNoteIDs").load('check_noteIDs.php?noteDate='+noteDate + "¬eUser="+noteUser);
});
My php code is as follows:
$result = mysqli_query($con,"
SELECT ID, ClientID, Note, ToDoDate, CaseID
FROM ToDoNotes
WHERE ToDoStatus='0' and Deleted='0' and `ToDoDate`='".$_GET['noteIDsDate']."' and User='".$_GET['noteIDsDate']."'");
while($row = mysqli_fetch_array($result))
{
$ID = $row['ID'];
$ClientID = $row['ClientID'];
$Note = $row['Note'];
$ToDoDate = $row['ToDoDate'];
$CaseID = $row['CaseID'];
}
?>
<table class="table table-striped">
<thead>
<tr>
<th>Note ID</th>
<th>Client ID</th>
<th>Case ID</th>
<th>Note</th>
<th>To Do Date</th>
</tr>
</thead>
<tbody>
<tr>
<td><? echo $noteID; ?></td>
<td><? echo $ClientID; ?></td>
<td><? echo $CaseID; ?></td>
<td><? echo $Note; ?></td>
<td><? echo $ToDoDate; ?></td>
</tr>
</tbody>
</table>
Can anyone here offer any assistance please? Any help will be greatly appreciated!
Thanks!
Suppose you have form.php like below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form method="post" id="btnCheckNoteIDs">
<label> User</label>
<input type="text" name="user" id="noteUser"><br>
<label>Date</label>
<input type="date" name="date" id="noteDate"><br>
<input type="submit" value="submit">
</form>
<br>
<div id="LoadNoteIDs"></div>
</body>
</html>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
crossorigin="anonymous"></script>
<script>
$(document ).ready(function() { //make sure document is ready
$('#btnCheckNoteIDs').submit(function(e){
e.preventDefault();//to prevent default behaviour
var noteUser = $("#noteUser").val();
var noteDate = $("#noteDate").val();
if(noteUser==undefined){
alert('No noteuser');
return false;
}else if(noteDate==undefined){
alert('no note date');
return false;//stop sending
}
//to convert %2F, use decodeURIComponent
var param= 'noteDate='+decodeURIComponent(noteDate) + '¬eUser='+noteUser;
$.ajax({
url: "check_noteIDs.php",
data: param,
type: "post",
success: function(data){
$('#LoadNoteIDs').html(data);
}
});
});
});
</script>
in check_noteIDs.php which must be in the same folder where you put the form.php
require_once "dbconfig.php";
$user= isset($_REQUEST['noteUser'])? $_REQUEST['noteUser']:'';
$date = isset($_REQUEST['noteDate'])? date('Y-m-d', strototime($_REQUEST['noteDate'])):'';
//You can validate here.
$result = mysqli_query($con," SELECT ID, ClientID, Note,
ToDoDate, CaseID
FROM `ToDoNotes`
WHERE `ToDoStatus`='0' AND `Deleted`='0'
AND `ToDoDate`='$date'
AND `User`='$user'");
$row = mysqli_fetch_assoc($result);
<table class="table table-striped">
<thead>
<tr>
<th>Note ID</th>
<th>Client ID</th>
<th>Case ID</th>
<th>Note</th>
<th>To Do Date</th>
</tr>
</thead>
<tbody>
<tr>
<td><?php echo $row['ID']; ?></td>
<td><?php echo $row['ClientID']; ?></td>
<td><?php echo $row['CaseID']; ?></td>
<td><?php echo $row['Note']; ?></td>
<td><?php echo $row['ToDoDate']; ?></td>
</tr>
</tbody>
</table>
<?php
mysqli_free_result($result);
mysqli_close($con);
?>
I think your issue is the submit button in your form, submits the form before the script executes. If that's the case, you need to update your script as below:
$("#btnCheckNoteIDs").click(function(event){
event.preventDefault();
var noteUser = $("#noteUser").val();
var noteDate = $("#noteDate").val();
$("#LoadNoteIDs").load('check_noteIDs.php?noteDate='+noteDate + "¬eUser="+noteUser);
});
Related
I am looking to insert rows to the table but
The rows are echoed but not displayed inside the table.
The HTML code of the project is:
<div class="container">
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>SN</th>
<th>Category</th>
<th>Parent</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody id="displayCategory">
</tbody>
</table>
</div>
The main.js file of the project is:
It fetches data from the PHP file below:
$(document).ready(function () {
manageCategory();
function manageCategory(){
$.ajax({
url: DOMAIN + "/includes/process.php",
method: "POST",
data: { manageCategory: 1 },
success: function (data) {
$("#displayCategory").html(data);
alert(data);
console.log(data);
}
})
};
}
PHP code of the project is:
<?PHP
if (isset($_POST["manageCategory"])) {
$m = new Manage();
$result = $m->manageTableWithPagination('pdcts_categories', 1);
$rows = $result['rows'];
$pagination = $result['pagination'];
if (count($rows) > 0) {
foreach ($rows as $row) {
$n = 0;
?>
<tr>
<td><?php echo ++$n; ?></td>
<td><?php echo $row["Category"]; ?></td>
<td><?php echo $row["Parent"]; ?></td>
<td>
Active
</td>
<td>
Edit
Delete
</td>
</tr>
<?php
}?>
<!-- <tr><td colspan="5"><?php echo $pagination; ?></td></tr> -->
<?php exit(); }
}?>
Try appending data (insted of html) like so:
$("#displayCategory").append(data);
note: check in the console that your php code is returning valid html (<tr> data)
How can I hide a particular <tr> based on php variable associated with that <tr>(incremental variable $i) with jQuery when the table is being populated dynamically through Mysql. I have looked around but not getting any clue.
<table id="example">
<thead>
<tr>
<th>S.No.</th>
<th>Item Number</th>
<th>Question</th>
<th>Option-A</th>
<th>Option-B</th>
<th>Option-C</th>
<th>Option-D</th>
<th style="text-align: center;">Correct Ans.</th>
<th style="text-align: center;">Marks</th>
<th style="text-align: center;">Action</th>
</tr>
</thead>
<tbody>
<?php
if ($query != '') {
$res = mysql_query($query) ;
$i = 1;
while($row = mysql_fetch_array($res))
{
extract($row);
?>
<tr class="record">
<td><?php echo $i ; ?></td>
<td><?php echo $item_no ; ?></td>
<td><?php echo $level_id ; ?></td>
<td><textarea disabled name="question" rows="4" cols="35"><?php echo $question ; ?></textarea></td>
<td><?php echo $option_A ; ?></td>
<td><?php echo $option_B ; ?></td>
<td><?php echo $option_C ; ?></td>
<td><?php echo $option_D ; ?></td>
<td><?php echo $correct_ans ; ?></td>
<td><?php echo $marks ; ?></td>
<td> </td>
<script type="text/javascript" >
$(function() {
$(".delbutton").click(function() {
var del_id = $(this).attr("id");
var info = 'id=' + del_id;
var $tr = $(this).closest('tr');
if (confirm("Sure you want to delete this post? This cannot be undone later.")) {
$.ajax({
type : "POST",
url : "delete_entry.php", //URL to the delete php script
data: info,
success : function(response) {
if(response=='deletion success'){
$tr.find('td').fadeOut(1000,function(){ $tr.remove(); });
}
}
});
}
return false;
});
});
</script>
</tr>
<?php $i++; } }
</tbody>
</table>
And my ajax page,
<?php
header('Content-Type: application/json');
session_start();
require("../config.php");
require("../Database.class.php");
require("../site.php");
$db = new Database(DB_SERVER, DB_USER, DB_PASS, DB_DATABASE);
$fnc=new site_functions($db);
$id = $_POST['id'];
$deleted_date = date("Y-m-d h:i:s");
$deleted_by = $_SESSION['session_admin_id'] ;
$nots = $db->idToField("tbl_ques","notes",$id);
if ($nots == "")
{
$date_string = "last deleted on|".$deleted_date."|" ;
}
else {
$date_string = $nots."last deleted on|".$deleted_date."|" ;
}
$fnc->update_is_not_deleted_for_Pearsonvue("tbl_ques",$id, "$deleted_date", $deleted_by);
$notes_data = array("notes"=>$date_string);
if($db->query_update("tbl_ques", $notes_data, "id=$id")){
http_response_code();
echo json_encode('deletion success');
}else{
http_response_code(204);
}
?>
You are already close - in fact it looks like your code should work on the first click at least. Anyway,
Change line
$tr.find('td').fadeOut(1000,function(){ $tr.remove(); });
to
$('#' + del_id).closest('tr').remove(); });
What this does is find the delete button element in the DOM, then look 'up' the DOM structure to the first TR element, and remove that from the DOM.
It is generally better to rely on simple variables within async callbacks because relying on objects, such as $this or in your case $tr can cause issues where the object pointed to by the $tr variable is not the one you expected.
EDIT: Added the working snippet below to illustrate the technique. If you still have a problem please create a minimal verifiable version as a snippet from your code so that we can pinpoint the issue.
$('.del').on('click', function() {
$(this).closest('tr').remove();
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="example">
<thead>
<tr>
<th>First name</th>
<th>Second name</th>
<th>Age</th>
<th style="text-align: center;">Action</th>
</tr>
</thead>
<tbody>
<tr>
<td>Joe</td>
<td>Bloggs</td>
<td>22</td>
<td style="text-align: center;">
<button id='A1' class='del'>Delete</button>
</td>
</tr>
<tr>
<td>Jane</td>
<td>Bloggs</td>
<td>19</td>
<td style="text-align: center;">
<button id='A2' class='del'>Delete</button>
</td>
</tr>
<tr>
<td>Joanne</td>
<td>Bloggs</td>
<td>28</td>
<td style="text-align: center;">
<button id='A3' class='del'>Delete</button>
</td>
</tr>
</tbody>
</table>
I am little confused in making one function in my PHP page. Actually I want make one function which can transfer value from Filed A to filed B.
My current code is like below
<table class="table table-hover table-bordered">
<thead>
<tr>
<th>S.No.</th>
<th>Profile</th>
<th>Username</th>
<th>Email</th>
<th>Name</th>
<th>Mobile</th>
<th>Requested Credit</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php if(mysqli_num_rows($result) > 0) { ?>
<?php $s=1; while($row = mysqli_fetch_assoc($result)) { ?>
<tr>
<td><?php echo $s;?></td>
<td><img class="img-thumbnail" style="height:50px;width:50px;" src="<?php echo $row['user_image']; ?>" alt="userimg" ></td>
<td><?php echo $row['username']; ?></td>
<td><?php echo $row['email']; ?></td>
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['mobile']; ?></td>
<td><?php echo $row['request_redeem']; ?></td>
<td> <button onClick="reply(<?php echo $row['user_id'];?>);" class="btn btn-xs " type="button" ><i aria-hidden="true" class="fa fa-thumbs-down"> Approve</i></button> </td>
</tr>
<?php $s++; } ?>
<?php } ?>
</tbody>
in this request_redeem is value which I want transfer in filed called Credit. Both filed is in same database table. Can anyone please suggest me what should I do for it ? I am newbie and learning PHP yet...so Please let go my foolish questions if you think. Thanks
You should call $.ajax function on click on button.Like this:
$.ajax({ url: '/my/site',
data: {action: 'test'},
type: 'post',
success: function(output) {
alert(output);
}
});
Through ajax function on given url, you can create function there and update value in that function and return response that would update value in above view.
Manish has given good example for sending the ajax request . You write a SQL query on the request url to update those values.
I just started using datatables and the instructions to initialize the table seems easy enough.
I am able to get the table to appear and all of the data is inside, however both the pagination and search function doesn't work.
Please help.
This is my code:
<?php
Include 'DBFunctions.php';
?>
<html>
<head>
<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="DataTables-1.10.9/media/css/jquery.dataTables.css">
<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="DataTables-1.10.9/media/js/jquery.dataTables.js"></script>
</head>
<body>
<?php
$queryData = "select c.*, o.officer_name from coa c, officer o WHERE o.persnum = c.importing_officer ORDER BY date_imported DESC";
$resultData = mysqli_query($link, $queryData) or die(mysqli_error($link));
?>
<h1>View All COAs</h1><br>
<table id="myTable" class="display">
<thead>
<tr>
<th>PO Number: </th>
<th>Chemical Name: </th>
<th>COA Date: </th>
<th>Quantity: </th>
<th>Plant Name: </th>
<th>Parameter Results: </th>
<th>Importing Officer: </th>
<th>COA Attempt: </th>
<th>Date Imported: </th>
<th>Pass/Fail: </th>
</tr>
</thead>
<?php
while ($row = mysqli_fetch_array($resultData)) {
?>
<tbody>
<tr>
<td><?php echo $row['po_number']?></td>
<td><?php echo $row['chemical_name']?></td>
<td><?php echo $row['date_coa']?></td>
<td><?php echo $row['quantity']?></td>
<td><?php echo $row['plant_name']?></td>
<td><?php echo $row['parameters_results']?></td>
<td><?php echo $row['officer_name']?></td>
<td><?php echo $row['coa_attempt']?></td>
<td><?php echo $row['date_imported']?></td>
<td><?php echo $row['pass_or_fail']?></td>
</tr>
</tbody>
<?php } ?>
</table>
<script>
$(document).ready( function () {
$('#myTable').DataTable({
});
} );
</script>
</body>
</html>
Take <tbody> out of the while loop so it looks like:
<tbody>
<?php
while ($row = mysqli_fetch_array($resultData)) {
?>
<tr>
<td><?php echo $row['po_number']?></td>
<td><?php echo $row['chemical_name']?></td>
<td><?php echo $row['date_coa']?></td>
<td><?php echo $row['quantity']?></td>
<td><?php echo $row['plant_name']?></td>
<td><?php echo $row['parameters_results']?></td>
<td><?php echo $row['officer_name']?></td>
<td><?php echo $row['coa_attempt']?></td>
<td><?php echo $row['date_imported']?></td>
<td><?php echo $row['pass_or_fail']?></td>
</tr>
<?php } ?>
</tbody>
You will have to enable the various options that datatable provide, for search and pagination you need to do this.
You should check the documentation for other available options
$(document).ready( function () {
$('#myTable').DataTable({
"paging": true,
"searching": true,
});
} );
hi i found a script which uses checkbox to select all/ unselect all checkboxex which i found a working example here http://jsfiddle.net/ThiefMaster/HuM4Q/
the problem is when i tried to integrate it to my own html. it doenst work anymore, here is my code:
javascript:
<head>
<script>
$('#checkAll').click(function() {
if(this.checked) {
$('input:checkbox').attr('checked', true);
}
else {
$('input:checkbox').removeAttr('checked');
}
});
$('input:checkbox:not(#checkAll)').click(function() {
if(!this.checked) {
$('#checkAll').removeAttr('checked');
}
else {
var numChecked = $('input:checkbox:checked:not(#checkAll)').length;
var numTotal = $('input:checkbox:not(#checkAll)').length;
if(numTotal == numChecked) {
$('#checkAll').attr('checked', true);
}
}
});
</script>
</head>
and these is my html:
<h2>Courses</h2>
<?php
$attributes = array('name' => 'list','id' => 'form' );
echo form_open('courses/edit',$attributes);?>
<table class="data display datatable" id="example">
<thead>
<tr>
<th>ID</th>
<th>Title</th>
<th>Description</th>
<th>Units</th>
<th>Notes</th>
<th><input type="checkbox" id="checkAll"></th>
</tr>
</thead>
<tbody>
<?php foreach($query->result_array() as $row): ?>
<tr class="even gradeC">
<td><?php echo anchor('courses/details/'.$row['courseID'],$row['courseID']);?></td>
<td><?php echo $row['courseTitle'];?></td>
<td><?php echo $row['courseDesc'];?></td>
<td><?php echo $row['courseUnits'];?></td>
<td><?php echo $row['courseNotes'];?></td>
<td><input type="checkbox" name="checkID[]" id="checkID" value="<?php echo $row['courseID'];?>"/></td>
</tr>
<? endforeach; ?>
</tbody>
</table>
Try fixing this line:
<td><input type="checkbox" name="checkID[]" id="checkID" value="<?php echo $row['courseID'];?>"/></td>
The id attribute should be unique, eg, only one element should have the id "checkID", not every row. Try removing the attribute altogether or make it unique for each row to see if your javascript sorts itself out.
Also, you need a line like this at the top, in your head:
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
That script used jQuery. Make sure you include the jQuery script in your page.