I'm trying to print the data from the sql for record purposes but I'm using datatable so when I try to click print, the record doesn't show everything. It only shows the current data from the page 1 of the datatable. How will I do it? Plus, when I tried printing it, the display also shows the include function of the php. Javascript solutions are allowed. Here is my code
<?php include ('sidebar.php'); ?>
<main id="playground">
<?php include ('header.html'); ?>
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section class="panel panel-info">
<header class="panel-heading">
<h4 class="panel-title">List of employees</h4>
</header>
<div class="panel-body">
<?php
include('configuration.php');
$sql = "SELECT firstname, lastname, status, idnumber FROM employees ORDER BY lastname ASC";
$result = $conn->query($sql);
?>
<table class="table table-striped datatable" id="datatables" >
<thead>
<tr>
<th>Last Name</th>
<th>First Name</th>
<th>ID Number</th>
</tr>
</thead>
<?php
if ($result->num_rows > 0) { // output data of each row?>
<tbody>
<button onclick="myFunction()">Print this page</button>
<?php while($row = $result->fetch_assoc()) {
if($row['status']=='p'){
?>
<?php { //this form will display the set of pending applications
echo'<tr>';
echo '<td>' . $row['lastname'] . '</td>';
echo '<td>' . $row['firstname'] . '</td>';
echo '<td>' . $row['idnumber'] . '</td>';
echo'</tr>';
}
?>
<?php } //if statement
} //while statement
?>
</tbody>
</table>
<?php
}else {
echo "0 results";
}
?>
</div>
</section>
<!-- end of STRIPED ROWS TABLE -->
</div> <!-- / col-md-12 -->
</div> <!-- / row -->
</div> <!-- / container-fluid -->
</main> <!-- /playground -->
<?php include ('notifications.html'); ?>
<div class="scroll-top">
<i class="ti-angle-up"></i>
</div>
</div> <!-- /animsition -->
<script>
function myFunction() {
window.print();
}
</script>
</body>
</html>
Please use
$('#datatables').DataTable( {
buttons: [
'print'
]
} );
Please check Document and Reference
Use Below 2 functions:
function CreateTableFromObject(tblObj) {
objHeader = JSON.parse(JSON.stringify(tblObj.buttons.exportData()))["header"];
objRows = JSON.parse(JSON.stringify(tblObj.buttons.exportData()))["body"];
//Check If Action Exists in Table and remove it
var index = objHeader.indexOf('Action');
if (index > -1) {
objHeader.splice(index, 1);
}
tblToPrint = "<table style='border: 1px solid black; border-collapse: collapse;'><thead><tr>";
$.each(objHeader, function (key, value) {
tblToPrint += "<th style='border: 1px solid black;'>" + value + "</th>";
});
tblToPrint += "</tr></thead><tbody>";
$.each(objRows, function (key, value) {
tblToPrint += "<tr>";
//If action exists then decrease target by 1
if (index > -1) {
target = value.length - 1;
}else {
target = value.length;
}
for (var i = 0; i < target; i++) {
tblToPrint += "<td style='border: 1px solid black;'>" + value[i] + "</td>";
}
tblToPrint += "</tr>";
});
tblToPrint += "</tbody></table>";
return tblToPrint;
}
function PrintWindowAddParts() {
var tblObj = $("#YourTable").DataTable();
var tblViewRMA = CreateTableFromObject(tblObj);
var printContents = "<div class='dataTables_wrapper form-inline dt-bootstrap'>" + tblViewRMA + "</div>";
var size = 'height=' + $(window).height() + 'px,width=' + $(window).width() + 'px';
var mywindow = window.open('', 'PRINT', size);
mywindow.document.write('<html><head><title>' + "My Title" + '</title>');
mywindow.document.write('</head><body >');
mywindow.document.write('<h4>' + "My Title" + '</h4>');
mywindow.document.write(printContents);
mywindow.document.write('</body></html>');
mywindow.document.close();
mywindow.focus();
mywindow.print();
mywindow.close();
return true;
}
Your Print function is Ready.
Related
I am creating the form to select all option to show in the below table, I want to search when I am selected the option show in the table. My part to do is let me to onchange "Transaction Type" then show the below table. How to function can let me to select all option to show in the below table? Hope anyone can give me example or edit in my coding to guide me how to do it. I want the output can follow my select date range and transaction type to show the table.
transaction_history file to show the frontend create the form and pass the data to the backend.
<?php
$system_user_type = $user_type;
$lang = $_COOKIE["Language"];
$new_cur_date = date("d-m-Y", strtotime($cur_date));
require_once("language/lang_transaction_" . $lang . ".php");
?>
<html>
<head>
</head>
<body>
<div class="row">
<div class="col-lg-12">
<div class="box form-group">
<header>
<h5><?php echo $language["LIST_TITLE1"]; ?></h5>
<!-- .toolbar -->
<div class="toolbar">
<nav style="padding: 8px;">
<a href="javascript:;" class="btn btn-default btn-xs collapse-box">
<i class="fa fa-minus"></i>
</a>
</nav>
</div><!-- /.toolbar -->
</header>
<section class="content">
<div class="col-lg-12 form-group" >
<label for="text1" class="form-group control-label col-lg-2"><?php echo $language['type']; ?>:</label>
<div class="col-lg-2">
<select id="select_type" class="form-group form-control required" onchange="show_table();">
<option value="transfer" selected><?php echo $language["transfer"]; ?></option>
<option value="withdraw"><?php echo $language["withdraw"]; ?></option>
<option value="upgrade"><?php echo $language["upgrade"]; ?></option>
<option value="register">Register</option>
<option value="receive"><?php echo $language["receive"]; ?></option>
</select>
</div>
<div class="col-lg-8"></div>
</div>
<div class="col-lg-12 form-group">
<label for="text1" class="form-group control-label col-lg-2">Date Range:</label>
<div class="col-lg-2">
<?php echo custom_period_opt(); ?>
</div>
<label for="text1" class="form-group control-label col-lg-2">Date Created</label>
<div class="col-lg-2">
<input type="text" class="form-group form-control datepicker" id="start_date" name="start_date" data-date-format="dd-mm-yyyy" title="" value="<?php echo $new_cur_date; ?>" readonly>
</div>
<label for="text1" class="form-group control-label col-lg-2">To</label>
<div class="col-lg-2">
<input type="text" class="form-group form-control datepicker" id="end_date" name="end_date" data-date-format="dd-mm-yyyy" title="" value="<?php echo $new_cur_date; ?>" readonly>
</div>
</div>
<div class="col-lg-12" style="text-align:center; padding-bottom:10px; padding-top:10px;">
<button id="search_button" type="button" class="btn btn-sm btn-primary" onclick="search2_('search', 'bill_table', 'billing');">Search</button>
<button id="clear" type="button" class="btn btn-sm btn-default" onclick="clearData()">Clear</button>
</div>
<div class="" id="table_result">
</div>
</section>
</div>
</div>
</div>
</body>
</html>
<script>
$(function() {
show_table();
$("#select_type").on("change", function() {
show_table();
});
});
function show_table() {
//alert(123);
var select_type = $("#select_type").val();
$.ajax({
url: "?f=transaction_table",
type: "POST",
data: {
select_type: select_type
},
before_send: function() {
show_overLay();
//$('#patient_result').html('');
},
success: function(data) {
hide_overLay('');
//alert(data);
if (data) {
$("#table_result").html("");
$("#table_result").append(data);
//
$('.dataTable').dataTable();
} else {
alert("Please fill in the field.");
}
}
});
}
</script>
<style>
.myClass
{
display: none;
}
</style>
transaction_table file to show the backend function send to frontend page.Below is my coding:
<?php
$select_type = $_POST['select_type'];
if ($select_type == "withdraw") {
echo '<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>No</th>
<th>Date</th>
<th>Amount</th>
</tr>
</thead>
<tbody>';
$i = 1;
$select_transfer = 'SELECT * FROM withdrawal_record bp WHERE user_id = ' . $user_id . ' ORDER BY created';
$arr_transfer = db_conn_select($select_transfer);
foreach ($arr_transfer as $rs_transfer) {
echo '<tr>';
echo '<td>' . $i++ . '</td>';
echo '<td>' . date('d-m-Y', strtotime($rs_transfer['created'])) . '</td>';
echo '<td>' . $rs_transfer['withdraw_amount'] . '</td>';
echo '</tr>';
}
echo " </tbody>
</table>";
}elseif ($select_type == "transfer") {
?>
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>No</th>
<th>Date</th>
<th>To Type</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
<?php
$i = 1;
$select_transfer = 'SELECT * FROM transfer_history_bp WHERE user_id = ' . $user_id . ' ORDER BY created';
$arr_transfer = db_conn_select($select_transfer);
foreach ($arr_transfer as $rs_transfer) {
if($rs_transfer['point_type']=="2"){
$to_type="Register Point";
}elseif($rs_transfer['point_type']=="3"){
$to_type="Entertainment Point";
}elseif($rs_transfer['point_type']=="4"){
$to_type="Business Point";
}
echo '<tr>';
echo '<td>' . $i++ . '</td>';
echo '<td>' . date('d-m-Y', strtotime($rs_transfer['created'])) . '</td>';
echo '<td>' . $to_type . '</td>';
echo '<td>' . $rs_transfer['total_amount'] . '</td>';
echo '</tr>';
}
?>
</tbody>
</table>
<?php
}elseif ($select_type == "upgrade") {
?>
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>No</th>
<th>Date</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
<?php
$i = 1;
$select_transfer = 'SELECT * FROM upgrade_point WHERE user_id = ' . $user_id . ' ORDER BY created';
$arr_transfer = db_conn_select($select_transfer);
foreach ($arr_transfer as $rs_transfer) {
echo '<tr>';
echo '<td>' . $i++ . '</td>';
echo '<td>' . date('d-m-Y', strtotime($rs_transfer['created'])) . '</td>';
echo '<td>' . $rs_transfer['total_amount'] . '</td>';
echo '</tr>';
}
?>
</tbody>
</table>
<?php
}elseif ($select_type == "register") {
?>
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>No</th>
<th>Date</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
<?php
$i = 1;
$select_transfer = 'SELECT * FROM transfer_history_rp WHERE user_id = ' . $user_id . ' and created between "2019-11-01 12:25:05" and "2099-11-01 12:25:05" and use_type=1 ORDER BY created';
$arr_transfer = db_conn_select($select_transfer);
foreach ($arr_transfer as $rs_transfer) {
echo '<tr>';
echo '<td>' . $i++ . '</td>';
echo '<td>' . date('d-m-Y', strtotime($rs_transfer['created'])) . '</td>';
echo '<td>' . $rs_transfer['total_amount'] . '</td>';
echo '</tr>';
}
?>
</tbody>
</table>
<?php
}elseif ($select_type == "receive") {
?>
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>No</th>
<th>Date</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
<?php
$i = 1;
$select_transfer = 'SELECT * FROM extra_point WHERE user_id = ' . $user_id . ' ORDER BY created';
$arr_transfer = db_conn_select($select_transfer);
foreach ($arr_transfer as $rs_transfer) {
echo '<tr>';
echo '<td>' . $i++ . '</td>';
echo '<td>' . date('d-m-Y', strtotime($rs_transfer['created'])) . '</td>';
echo '<td>' . $rs_transfer['total_amount'] . '</td>';
echo '</tr>';
}
?>
</tbody>
</table>
<?php
}
?>
Below is my output, this output just can follow what I select the transaction type to onchange to show in the table:
Below is my database information:
If I understand your question correctly, then you need to include these additional parameters in your request as you already to with select_type.
First, get the additional values in theshowTable function, also add them to the request data:
function show_table() {
var select_type = $("#select_type").val();
var start_date = $("#start_date").val();
var end_date = $("#end_date").val();
$.ajax({
url: "?f=transaction_table",
type: "POST",
data: {
select_type: select_type,
start_date: start_date,
end_date: end_date
},
// ...
}
then, receive the values in your PHP file like you already do with select_type:
<?php
$select_type = $_POST['select_type'];
$start_date = $_POST['start_date'];
$end_date = $_POST['end_date'];
// ...
Finally, you have to adjust your queries accordingly. As you already have and created between "2019-11-01 12:25:05" and "2099-11-01 12:25:05" in your queries, it's just a matter of replacing the hardcoded dates with the ones you received. Do not forget to sanitize your input dates! If possible use prepared statements.
Note 1: Your script and style tags are outside of the html part of your site. This is not valid. These tags belong into either the head or the body tag.
Note 2: There are whitespaces before your opening html tag. You may wan't to avoid this too, since it can trigger IE into quirks mode. Simply change this
?>
<html>
to this
?><html>
I have been staring at this for literally two hours trying to fix it. Any help would be appreciated. For some reason the table isn't being loaded when the button is clicked.
Here's the relevant part of my head:
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css" />
</head>
This is my table:
<div class="container">
<div class="midtxt">
<div id = "transactions-sav" style="margin-top: 0;">
<h2>Most Recent Transactions</h2>
<table>
<thead>
<tr>
<th>Username</th>
<th>Amount</th>
<th>Time & Date</th>
<th>Account Type</th>
</tr>
</thead>
<tbody>
<div id="trans-div">
</div>
</tbody>
</table>
<hr />
</div>
</div>
<a class="btn light-blue waves-effect waves-light table-end" id="trans-more" style="margin-top: 35px;">Load More Transactions</a>
</div>
This is my Ajax transmitter:
<script>
$(document).ready(function() {
let transCount = 20;
$('#trans-more').on('click', function() {
transCount += 20;
console.log('click');
console.log(transCount);
$('#trans-div').load('includes/loadtranshistajax.inc.php', {transNewCount: transCount,user_id: <?php echo $_SESSION['user_id']; ?>}, function() {
console.log('callback');
});
});
console.log('test1');
});
</script>
This is my PHP script for generating the table. It is worth noting that initialize() starts a session.:
<?php
require_once 'dbc-stu.inc.php';
require_once 'initialize.inc.php';
require_once 'app/transactions/transhist.inc.php';
initialize();
initialize_secure();
//Import the count
$limit = $_POST['transNewCount'];
$userID = $_SESSION['user_id'];
$sql = "SELECT * FROM transactions WHERE trans_targetID ='$userID' ORDER BY trans_time DESC LIMIT $limit";
$result = mysqli_query($conn, $sql);
$resultCheck = mysqli_num_rows($result);
while ($row = mysqli_fetch_assoc($result)) {
echo '<tr>';
foreach ($row as $key => $value) {
if ($key === 'trans_time') {
$time = $value;
date_default_timezone_set("America/Los_Angeles");
$time = date("F j, Y, g:i a",$time);
} elseif ($key === 'trans_amount') {
$amnt = $value;
} elseif ($key ==='trans_targetID') {
$username = idToUsername($value);
} elseif ($key === 'trans_accType') {
$accType = $value;
}
}
echo '<td>' . $username . '</td>';
echo '<td>' . $amnt . '</td>';
echo '<td>' . $time . '</td>';
echo '<td>' . $accType . '</td>';
echo '</tr>';
}
Edit, thanks a lot everybody. I'm fairly new to the web development community, so it's cool to see everyone help out!
Remove div tag from tag and add id in tbody attribute as below.
<tbody id="trans-div"></tbody>
Put the php code<?php echo $_SESSION['user_id']; ?> inside a <script> tag into double quote as it's causing the SyntaxError which break` your script code.
That's why you are not able to view XHR into console
Try the following:
$('#trans-div').load('includes/loadtranshistajax.inc.php', {transNewCount: transCount,user_id: "<?php echo $_SESSION['user_id']; ?>"}, function() {
console.log('callback');
});
I am new in php. I trying to know Multiple Inline Insert into Mysql using Ajax JQuery in PHP.
Then I follow this tutorial on "webslesson". My all codes and database are Ok as like as webslesson web tutorial . But my save button doesn't work and don't send any data in my database and also not shown any error....
index.php
<!DOCTYPE html>
<html>
<head>
<title>Multiple Inline Insert into Mysql using Ajax JQuery in PHP</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<br /><br />
<div class="container">
<br />
<h2 align="center">Multiple Inline Insert into Mysql using Ajax JQuery in PHP</h2>
<br />
<div class="table-responsive">
<table class="table table-bordered" id="crud_table">
<tr>
<th width="30%">Item Name</th>
<th width="10%">Item Code</th>
<th width="45%">Description</th>
<th width="10%">Price</th>
<th width="5%"></th>
</tr>
<tr>
<td contenteditable="true" class="item_name"></td>
<td contenteditable="true" class="item_code"></td>
<td contenteditable="true" class="item_desc"></td>
<td contenteditable="true" class="item_price"></td>
<td></td>
</tr>
</table>
<div align="right">
<button type="button" name="add" id="add" class="btn btn-success btn-xs">+</button>
</div>
<div align="center">
<button type="button" name="save" id="save" class="btn btn-info">Save</button>
</div>
<br />
<div id="inserted_item_data"></div>
</div>
</div>
</body>
</html>
<script>
$(document).ready(function(){
var count = 1;
$('#add').click(function(){
count = count + 1;
var html_code = "<tr id='row"+count+"'>";
html_code += "<td contenteditable='true' class='item_name'></td>";
html_code += "<td contenteditable='true' class='item_code'></td>";
html_code += "<td contenteditable='true' class='item_desc'></td>";
html_code += "<td contenteditable='true' class='item_price' ></td>";
html_code += "<td><button type='button' name='remove' data-row='row"+count+"' class='btn btn-danger btn-xs remove'>-</button></td>";
html_code += "</tr>";
$('#crud_table').append(html_code);
});
$(document).on('click', '.remove', function(){
var delete_row = $(this).data("row");
$('#' + delete_row).remove();
});
$('#save').click(function(){
var item_name = [];
var item_code = [];
var item_desc = [];
var item_price = [];
$('.item_name').each(function(){
item_name.push($(this).text());
});
$('.item_code').each(function(){
item_code.push($(this).text());
});
$('.item_desc').each(function(){
item_desc.push($(this).text());
});
$('.item_price').each(function(){
item_price.push($(this).text());
});
$.ajax({
url:"insert.php",
method:"POST",
data:{item_name:item_name, item_code:item_code, item_desc:item_desc, item_price:item_price},
success:function(data){
alert(data);
$("td[contentEditable='true']").text("");
for(var i=2; i<= count; i++)
{
$('tr#'+i+'').remove();
}
fetch_item_data();
}
});
});
function fetch_item_data()
{
$.ajax({
url:"fetch.php",
method:"POST",
success:function(data)
{
$('#inserted_item_data').html(data);
}
})
}
fetch_item_data();
});
</script>
insert.php
<?php
//insert.php
$connect = mysqli_connect("127.0.0.1", "root", "", "testing4");
if(isset($_POST["item_name"]))
{
$item_name = $_POST["item_name"];
$item_code = $_POST["item_code"];
$item_desc = $_POST["item_desc"];
$item_price = $_POST["item_price"];
$query = '';
for($count = 0; $count<count($item_name); $count++)
{
$item_name_clean = mysqli_real_escape_string($connect, $item_name[$count]);
$item_code_clean = mysqli_real_escape_string($connect, $item_code[$count]);
$item_desc_clean = mysqli_real_escape_string($connect, $item_desc[$count]);
$item_price_clean = mysqli_real_escape_string($connect, $item_price[$count]);
if($item_name_clean != '' && $item_code_clean != '' && $item_desc_clean != '' && $item_price_clean != '')
{
$query .= '
INSERT INTO item(item_name, item_code, item_description, item_price)
VALUES("'.$item_name_clean.'", "'.$item_code_clean.'", "'.$item_desc_clean.'", "'.$item_price_clean.'");
';
}
}
if($query != '')
{
if(mysqli_multi_query($connect, $query))
{
echo 'Item Data Inserted';
}
else
{
echo 'Error';
}
}
else
{
echo 'All Fields are Required';
}
}
?>
fetch.php
<?php
//fetch.php
$connect = mysqli_connect("127.0.0.1", "root", "", "testing4");
$output = '';
$query = "SELECT * FROM item ORDER BY item_id DESC";
$result = mysqli_query($connect, $query);
$output = '
<br />
<h3 align="center">Item Data</h3>
<table class="table table-bordered table-striped">
<tr>
<th width="30%">Item Name</th>
<th width="10%">Item Code</th>
<th width="50%">Description</th>
<th width="10%">Price</th>
</tr>
';
while($row = mysqli_fetch_array($result))
{
$output .= '
<tr>
<td>'.$row["item_name"].'</td>
<td>'.$row["item_code"].'</td>
<td>'.$row["item_description"].'</td>
<td>'.$row["item_price"].'</td>
</tr>
';
}
$output .= '</table>';
echo $output;
?>
This is my database......
item.sql
--
-- Database: `testing4`
- -
-- --------------------------------------------------------
--
-- Table structure for table `item`
--
CREATE TABLE `item` (
`item_id` int(11) NOT NULL,
`item_name` varchar(250) NOT NULL,
`item_code` varchar(250) NOT NULL,
`item_description` text NOT NULL,
`item_price` varchar(30) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
I'm having trouble trying to get data from a database. The code will only retrieve the first row of data from the Database. The data is correct but it does not matter what information I put into my html input field the data is the same in the new row that is added. Any help resolving this would be fantastic.
If someone was going to point out that I have both "POST" and "GET" mixed in my code, I could understand as that being a possible problem, but neither when matching would retrieve data from the DB, other than the first row of data in the table.
Any help with this would be great!!! Thanks to all who provide an answer in advance.
My HTML code:
index.php
<div class="row">
<div class="col-md-1"></div>
<div class="col-xs-3">
<h3 class="h4 text-center"><input type="text" name="barcode" id="barcode" size="90" class="col-md-9" value="" method="GET" placeholder="Barcode / Product Name"></h3>
</div>
</div>
<br />
<div class="row">
<div class="col-md-1"><p class=""></p></div>
<div class="col-md-6">
<table id="report" class="table table-bordered table-hover">
<thead>
<tr>
<td>SKU</td>
<td>Model</td>
<td>Item Description</td>
<td>Qty</td>
</tr>
</thead>
<tbody>
<?php get_item(); ?>
</tbody>
</table>
</div>
</div>
This is my AJAX script
<script>
var inp = $("#barcode");
// where #txt is the id of the textbox
$("#barcode").keyup(function (event) {
if (event.keyCode == 13)
{
if (inp.val().length > 0)
{
$.ajax({
url: "index.php",
type: "GET", //Also tried POST method. Didn't work either
data: {id: inp.val()},
success: function(response)
{
values = response.split(' - ');
$('#report tr:last').after(
"<tr class='table-row'>" +
"<td class=''>" + values[1] + "</td>" +
"<td class=''>" + values[2] + "</td>" +
"<td class=''>" + values[3] + "</td>" +
"<td class=''>" + values[4] + "</td></tr>");
}});
}
$('input[name=barcode]').val('');
}
});
</script>
Here is my php code
function get_item(){
global $con;
if(!empty($_POST))
{
$query = query("SELECT * FROM items");
confirm($query);
while($row = fetch_array($query)) {
$sku = $row['sku'];
$model = $row['category'];
$desc = $row['description'];
$qty = $row['qty'];
echo($id.' - '.$sku.' - '.$model.' - '.$desc.' - '.$qty);
die();
}
}
}
Move the die(); function call out of your while loop. It gets called rigth at the end of the first loop terminating your php script.
I've the code to initialize the modal-box:
<script>
var grid_modal_options = {
height: 'auto',
width: '80%',
modal: true
};
function showProductsModalBox() {
$("#products_modal_box").dialog(grid_modal_options);
$("#products_modal_box").parent().appendTo('form:first');
}
</script>
<div id="products_modal_box" title="Products" style="display: none;">
<div class="in">
<div class="grid-12-12">
<form id="products_modal_box_form" action="#" method="post">
<table>
<thead>
<tr>
<th> </th>
<th>Product</th>
</tr>
</thead>
<!-- Query for read mysql goes here (I skipped this line because it's not the main thing I'm gonna ask since it's run well) /-->
<tbody>
<?php
//read the results
while($fetch = mysqli_fetch_array($r)) {
print "<tr>";
print " <td><a href='#'>Choose</a></td>"; //--> How to return the value of $fetch[0]?
print " <td>" . $fetch[0] . "</td>"; //$fetch[0] == Product ID
print "</tr>";
}
?>
</tbody>
</table>
</form>
</div>
</div>
</div>
And:
<input type='text' id='products_id_textbox' name='products_id_textbox' />
<a href='#' onclick='showProductsModalBox(); return false;'>Choose products</a>
The code succeeds to show the modal box. But how to return the "Product" chosen by the user to the textbox "products_id_textbox"? Thanks.
add inline javascript:
<?php
while($fetch = mysqli_fetch_array($r)) {
print "<tr>";
print " <td>Choose</td>"; //--> How to return the value of $fetch[0]?
print " <td>" . $fetch[0] . "</td>"; //$fetch[0] == Product ID
print "</tr>";
}
?>
Instead using inline JS, you can write so (or something like this);
// php
while($fetch = mysqli_fetch_array($r)) {
print "<tr>";
print " <td><a rel='dialog' data-id='{$fetch[0]}'>Choose</a></td>";
print " <td>{$fetch[0]}</td>";
print "</tr>";
}
// js
$(document).ready(function(){
...
$("a[rel=dialog]").each(function(){
var id = this.getAttribute("data-id");
$('#products_id_textbox').val(id);
$('#products_modal_box').dialog('close');
});