Jump to content

Recommended Posts

I got the margin plus dates working but now I have to get the value of employee_id into $employee.
Here is the code:
 

<?php
 	include "header.php";

    $from = $_GET['from'] ?? '';
    $to = $_GET['to'] ?? '';
    $employee = $_GET['view'];
	
	$tdata = "";

	if (!empty($from) && !empty($to)) {
		echo $query = "
		SELECT products.product_name,sum(salesdetails.salesdetails_amount) AS amount, sum(salesdetails.salesdetails_pricedollars) AS total
		FROM `sales`
		JOIN salesdetails ON salesdetails.salesdetails_salesticketnr = sales.sales_ticketnr
		JOIN products ON products.product_id = salesdetails.salesdetails_productid
		WHERE sales.sales_employeeid = '$employee' AND (sales.sales_date BETWEEN ? AND ?)
		GROUP BY products.product_name";
		
		$result = mysqli_prepare($con,$query);
		$result->bind_param('ss', $from, $to);
		$result->execute();
		$result->bind_result($product_name, $amount, $total);
		
		$totaltotal = 0;
		
		while($row = $result->fetch()) {
		
			$totaltotal += $total;
			
			
			$tdata .= sprintf("<tr>
								<td>%s</td>
								<td>%d</td>
								<td>%d</td>
							   </tr>
							", $product_name, $amount, $total);
		}
		
		$tdata .= sprintf("<tr class='tot'>
							<td>%s</td>
							<td>%s</td>
							<td>%d</td>
						   </tr>
						", '', '', $totaltotal);
	 		 
			}
		?>
		
		


<!DOCTYPE html>
<html lang='en'>
	<head>
		<meta charset='utf-8'>
		<style type='text/css'>
			table {
			width:  60%;
			border-collapse: collapse;
			margin: 20px auto;
			}
			th, td {
				padding: 4px 10px;
			}
			th {
				text-align: right;
			}
			td {
				text-align: right;
			}
			td:first-child {
				text-align: left;
			}
			th:first-child {
				text-align: left;
			}
			.la {
				text-align: left;
			}
			.tot {
				background-color: #666;
				color: white;
			}
		</style>
	</head>
	
	<body>
		<div class="app-content content">
			<div class="content-wrapper container-xxl p-0">
				<div class="content-body">
					<section class="invoice-list-wrapper">
						<div class="card">
							<div class="card-datatable table-responsive card-body">
								<form method="GET">
									<div class="row">
										<p style="font-size:18px; font-weight: bold"> Sales per Product</p>
										<div class="col col-md-2">
											<label for='from'>Date From:</label>
											<input type="date" value="<?= $from ?>" name="from" id="from" class="form-control" required>
										</div>
										<div class="col col-md-2">
											<label for='to'>Date To:</label>
											<input type="date" value="<?= $to ?>" name="to" id="to" class="form-control" required>
										</div>
										
										<div class="col col-md-3">
											<label for="name">Employee:</label>
											<select class="form-control" name="sales_repid" id="rep">
												<?php
													$query = "
													SELECT *
													FROM employees
													WHERE employee_active = 1
													ORDER BY employee_name asc";
													$result = mysqli_query($con,$query);
													$i =1;
												?>
													<option value="choose employee">Choose Employee</option>
												<?php
													while($row = mysqli_fetch_assoc($result)){
												?>
														<option value="<?php echo $row['employee_id']?>" <?php if(isset($_GET['view']) && $_GET['view'] == $row['employee_id']){ echo 'selected'; }?> > <?php echo $row['employee_name']?></option>
												<?php
													}
												?>
											</select>
										</div>
										
										<div class="col col-md-1">
											<label for='submit'>&nbsp;</label>
											<input type='submit' class="form-control" >
										</div>
									</div>	
								</form>
							</div>
						</div>
						<div class="card">
							<div class="card-datatable table-responsive card-body">
								<div class="col-md-12" >
									<table class="table dataTable" id="myTable2">
										<thead>
											<tr>
												<th>Product</th>
												<th>Amount</th>
												<th>US$</th>
											</tr>
										</thead>
										<tbody class="tbody">
											<?= $tdata ?>
										</tbody>
									</table>
								</div>				
							</div>					
						</div>	
					</section>
				</div>
			</div>
		</div>
	</body>	

The problem is when choosing an employee, I am trying but nothing works, anybody maybe an idea?
Thanks.

You are referencing $_GET['view'] but you do not have an input with that name ('view'). The name of your <select> is "sales_repid" so you need use $_GET['sales_repid'].

Also, the "for" in you label for the select should be the id of the input element (should be for='rep' )

10 minutes ago, Barand said:

You are referencing $_GET['view'] but you do not have an input with that name ('view'). The name of your <select> is "sales_repid" so you need use $_GET['sales_repid'].

Also, the "for" in you label for the select should be the id of the input element (should be for='rep' )

Yes, that was the solution, great!
Thank you very much, I now can continue.

Everything is working 100% but I want to make the user interface a little nicer.
When I open the page I get the screen with already the table part visible.
Is it possible to only have the input-part and the table-part comes after clicking submit?
Here is the code:

<?php
 	include "header.php";

	$from = $_GET['from'] ?? '';
    $to = $_GET['to'] ?? '';
    $employee = $_GET['employee_id'];

	$tdata = "";

	if (!empty($from) && !empty($to)) {
		$query = "
		SELECT employees.employee_name
		FROM `employees`
		WHERE employees.employee_id = '$employee'";
		$result = mysqli_query($con,$query);
		while($row = mysqli_fetch_assoc($result)){
			$naampje = $row['employee_name'];
		}
		$query = "
		SELECT products.product_name,sum(salesdetails.salesdetails_amount) AS amount, sum(salesdetails.salesdetails_pricedollars) AS total
		FROM `sales`
		JOIN salesdetails ON salesdetails.salesdetails_salesticketnr = sales.sales_ticketnr
		JOIN products ON products.product_id = salesdetails.salesdetails_productid
		WHERE sales.sales_employeeid = '$employee' AND (sales.sales_date BETWEEN ? AND ?)
		GROUP BY products.product_name";
		$result = mysqli_prepare($con,$query);
		$result->bind_param('ss', $from, $to);
		$result->execute();
		$result->bind_result($product_name, $amount, $total);
		$totaltotal = 0;
		while($row = $result->fetch()) {
			$totaltotal += $total;
			$amount_neat = number_format($amount);
			$total_neat = number_format($total);
			$totaltotal_neat = number_format($totaltotal);
			$tdata .= 	"<tr>
							<td>$product_name</td>
							<td>$amount_neat</td>
							<td>$total_neat</td>
						</tr>";
		}
			$tdata .= 	"<tr class='tot'>
							<td></td>
							<td></td>
							<td>$totaltotal_neat</td>
						</tr>";
			}
?>

<!DOCTYPE html>
<html lang='en'>
	<head>
		<meta charset='utf-8'>
		<style type='text/css'>
			table {
			width:  60%;
			border-collapse: collapse;
			margin: 20px auto;
			}
			th, td {
				padding: 4px 10px;
			}
			th {
				text-align: right;
			}
			td {
				text-align: right;
			}
			td:first-child {
				text-align: left;
			}
			th:first-child {
				text-align: left;
			}
			.la {
				text-align: left;
			}
			.tot {
				background-color: #666;
				color: white;
			}
		</style>
	</head>
	
	<body>
		<div class="app-content content">
			<div class="content-wrapper container-xxl p-0">
				<div class="content-body">
					<section class="invoice-list-wrapper">
						<div class="card">
							<div class="card-datatable table-responsive card-body">
								<form method="GET">
									<div class="row">
										<p style="font-size:18px; font-weight: bold"> Sales per Product</p>
										<div class="col col-md-2">
											<label for='from'>Date From:</label>
											<input type="date" value="<?= $from ?>" name="from" id="from" class="form-control" required>
										</div>
										<div class="col col-md-2">
											<label for='to'>Date To:</label>
											<input type="date" value="<?= $to ?>" name="to" id="to" class="form-control" required>
										</div>
										<div class="col col-md-3">
											<label for="employee_id">Employee:</label>
											<select class="form-control" name="employee_id" id="employee_id">
												<?php
													$query = "
													SELECT *
													FROM employees
													WHERE employee_active = 1
													ORDER BY employee_name asc";
													$result = mysqli_query($con,$query);
													$i =1;
												?>
													<option  value="choose employee">Choose Employee</option>
												<?php
													while($row = mysqli_fetch_assoc($result)){
												?>
													<option value="<?php echo $row['employee_id']?>" <?php if(isset($_GET['employee_id']) && $_GET['employee_id'] == $row['employee_id']){ echo 'selected'; }?> > <?php echo $row['employee_name']?> </option>
												<?php
													}
												?>
											</select>
										</div>
										<div class="col col-md-1">
											<label for='submit'>&nbsp;</label>
											<input type='submit' class="form-control" >
										</div>
									</div>	
								</form>
							</div>
						</div>
						
						<div class="card">
							<div class="card-datatable table-responsive card-body">
								<div class="col-md-12" >
									<table class="table dataTable" id="myTable2">
										<thead>
											<tr>
												<th>Product</th>
												<th>Amount</th>
												<th>US$</th>
											</tr>
										</thead>
										<tbody class="tbody">
											<?= $tdata ?>
										</tbody>
									</table>
								</div>				
							</div>					
						</div>	
						
					</section>
				</div>
			</div>
		</div>
	</body>	
	
	<script src="app-assets/vendors/js/vendors.min.js"></script>
	<script src="app-assets/vendors/js/charts/apexcharts.min.js"></script>
	<script src="app-assets/js/core/app-menu.min.js"></script>
	<script src="app-assets/js/core/app.min.js"></script>
	<script src="app-assets/js/scripts/customizer.min.js"></script>
	<script src="app-assets/js/scripts/pages/dashboard-ecommerce.min.js"></script>
	<script src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js" ></script>
	<script src="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.min.js" ></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js" ></script>
	<script src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.html5.min.js" ></script>
	<script src="app-assets/vendors/js/tables/datatable/dataTables.bootstrap5.min.js"></script>
	<script src="app-assets/vendors/js/tables/datatable/dataTables.responsive.min.js"></script>
	<script src="app-assets/vendors/js/tables/datatable/responsive.bootstrap5.js"></script>
	<script src="app-assets/js/scripts/pages/app-invoice-list.min.js"></script>
	<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
	<script src="https://cdn.datatables.net/buttons/2.3.6/js/buttons.print.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>

	<script>
		$(document).ready( function () {
			$('#myTable').dataTable({
				"ordering": false
			})
			$('#myTable2').dataTable({
				"ordering": false,
				"dom": 'Btip',
				"buttons": ['print']
				});
			const from = $('#from').val().split('-').reverse().join('-');
			const to = $('#to').val().split('-').reverse().join('-');
			const employee="<?php echo $naampje; ?>";
			$('#myTable2').append('<caption style="caption-side: top; align:center"><span style="font-size: 1.3REM; color: #000000">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Sales for employee '+ employee +' from '+ from +'  to  '+ to +'</span></br></caption>')
		});
	</script>
</html>

I hope I explained my problem understandable.

Thanks
 

screen1.jpg

13 minutes ago, Barand said:

make the output of the table conditional on there being input of dates (as you did with the processing).

I am trying but it won't work.
It's my lack of knowledge of HTML I guess.
I tried with endif but no result.

1 hour ago, Barand said:
<html>
<body>
     <form>
        form stuff
     </form>

     <?php
         if (!empty($from) && !empty($to)) {
     ?>
             <table>
                table stuff
             </table>   
     <?php
         }
     ?>
</body>
</html>

 

The problem is the table doesn't come under the input and covers the whole screen.
I don't know where exactly from where to copy or move it.

26 minutes ago, Erwin007 said:

The problem is the table doesn't come under the input and covers the whole screen.
I don't know where exactly from where to copy or move it.

Now I have this; the table above the input and the table needs to be under the input.

screen2.thumb.jpg.76980fb3a47ad33f11aa551d8e69e240.jpg

<?php
 	include "header.php";

	$from = $_GET['from'] ?? '';
    $to = $_GET['to'] ?? '';
    $employee = $_GET['employee_id'];

	$tdata = "";

	if (!empty($from) && !empty($to)) {
		$query = "
		SELECT employees.employee_name
		FROM `employees`
		WHERE employees.employee_id = '$employee'";
		$result = mysqli_query($con,$query);
		while($row = mysqli_fetch_assoc($result)){
			$naampje = $row['employee_name'];
		}
		$query = "
		SELECT products.product_name,sum(salesdetails.salesdetails_amount) AS amount, sum(salesdetails.salesdetails_pricedollars) AS total
		FROM `sales`
		JOIN salesdetails ON salesdetails.salesdetails_salesticketnr = sales.sales_ticketnr
		JOIN products ON products.product_id = salesdetails.salesdetails_productid
		WHERE sales.sales_employeeid = '$employee' AND (sales.sales_date BETWEEN ? AND ?)
		GROUP BY products.product_name";
		$result = mysqli_prepare($con,$query);
		$result->bind_param('ss', $from, $to);
		$result->execute();
		$result->bind_result($product_name, $amount, $total);
		$totaltotal = 0;
		while($row = $result->fetch()) {
			$totaltotal += $total;
			$amount_neat = number_format($amount);
			$total_neat = number_format($total);
			$totaltotal_neat = number_format($totaltotal);
			$tdata .= 	"<tr>
							<td>$product_name</td>
							<td>$amount_neat</td>
							<td>$total_neat</td>
						</tr>";
		}
			$tdata .= 	"<tr class='tot'>
							<td></td>
							<td></td>
							<td>$totaltotal_neat</td>
						</tr>";
		?>	
		
		<div class="app-content content">
			<div class="content-wrapper container-xxl p-0">
				<div class="content-body">
					<section class="invoice-list-wrapper">
						<div class="card">
							<div class="card-datatable table-responsive card-body">
								<div class="col-md-12" >
									<table class="table dataTable" id="myTable2">
										<thead>
											<tr>
												<th>Product</th>
												<th>Amount</th>
												<th>US$</th>
											</tr>
										</thead>
										<tbody class="tbody">
											<?= $tdata ?>
										</tbody>
									</table>
								</div>		
							</div>					
						</div>	
					</section>
				</div>
			</div>
	 	</div>
	</body>		
			
		<?php
		}
?>

<!DOCTYPE html>
<html lang='en'>
	<head>
		<meta charset='utf-8'>
		<style type='text/css'>
			table {
			width:  60%;
			border-collapse: collapse;
			margin: 20px auto;
			}
			th, td {
				padding: 4px 10px;
			}
			th {
				text-align: right;
			}
			td {
				text-align: right;
			}
			td:first-child {
				text-align: left;
			}
			th:first-child {
				text-align: left;
			}
			.la {
				text-align: left;
			}
			.tot {
				background-color: #666;
				color: white;
			}
		</style>
	</head>
	
	<body>
		<div class="app-content content">
			<div class="content-wrapper container-xxl p-0">
				<div class="content-body">
					<section class="invoice-list-wrapper">
						<div class="card">
							<div class="card-datatable table-responsive card-body">
								<form method="GET">
									<div class="row">
										<p style="font-size:18px; font-weight: bold"> Sales per Product</p>
										<div class="col col-md-2">
											<label for='from'>Date From:</label>
											<input type="date" value="<?= $from ?>" name="from" id="from" class="form-control" required>
										</div>
										<div class="col col-md-2">
											<label for='to'>Date To:</label>
											<input type="date" value="<?= $to ?>" name="to" id="to" class="form-control" required>
										</div>
										<div class="col col-md-3">
											<label for="employee_id">Employee:</label>
											<select class="form-control" name="employee_id" id="employee_id">
												<?php
													$query = "
													SELECT *
													FROM employees
													WHERE employee_active = 1
													ORDER BY employee_name asc";
													$result = mysqli_query($con,$query);
													$i =1;
												?>
													<option  value="choose employee">Choose Employee</option>
												<?php
													while($row = mysqli_fetch_assoc($result)){
												?>
													<option value="<?php echo $row['employee_id']?>" <?php if(isset($_GET['employee_id']) && $_GET['employee_id'] == $row['employee_id']){ echo 'selected'; }?> > <?php echo $row['employee_name']?> </option>
												<?php
													}
												?>
											</select>
										</div>
										<div class="col col-md-1">
											<label for='submit'>&nbsp;</label>
											<input type='submit' class="form-control" >
										</div>
										
	<script src="app-assets/vendors/js/vendors.min.js"></script>
	<script src="app-assets/vendors/js/charts/apexcharts.min.js"></script>
	<script src="app-assets/js/core/app-menu.min.js"></script>
	<script src="app-assets/js/core/app.min.js"></script>
	<script src="app-assets/js/scripts/customizer.min.js"></script>
	<script src="app-assets/js/scripts/pages/dashboard-ecommerce.min.js"></script>
	<script src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js" ></script>
	<script src="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.min.js" ></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js" ></script>
	<script src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.html5.min.js" ></script>
	<script src="app-assets/vendors/js/tables/datatable/dataTables.bootstrap5.min.js"></script>
	<script src="app-assets/vendors/js/tables/datatable/dataTables.responsive.min.js"></script>
	<script src="app-assets/vendors/js/tables/datatable/responsive.bootstrap5.js"></script>
	<script src="app-assets/js/scripts/pages/app-invoice-list.min.js"></script>
	<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
	<script src="https://cdn.datatables.net/buttons/2.3.6/js/buttons.print.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>

	<script>
		$(document).ready( function () {
			$('#myTable').dataTable({
				"ordering": false
			})
			$('#myTable2').dataTable({
				"ordering": false,
				"dom": 'Btip',
				"buttons": ['print']
				});
			const from = $('#from').val().split('-').reverse().join('-');
			const to = $('#to').val().split('-').reverse().join('-');
			const employee="<?php echo $naampje; ?>";
			$('#myTable2').append('<caption style="caption-side: top; align:center"><span style="font-size: 1.3REM; color: #000000">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Sales for employee '+ employee +' from '+ from +'  to  '+ to +'</span></br></caption>')
		});
	</script>
</html>

 

<?php
    if (!empty($from) && !empty($to)) {
?>
   <div class="card">
      <div class="card-datatable table-responsive card-body">
          <div class="col-md-12" >
              <table class="table dataTable" id="myTable2">
                  <thead>
                      <tr>
                          <th>Product</th>
                          <th>Amount</th>
                          <th>US$</th>
                      </tr>
                  </thead>
                  <tbody class="tbody">
                      <?= $tdata ?>
                  </tbody>
              </table>
          </div>				
      </div>					
  </div>
<?php
    }
?>

I think that is what you need

 

 

2 minutes ago, dodgeitorelse3 said:
<?php
    if (!empty($from) && !empty($to)) {
?>
   <div class="card">
      <div class="card-datatable table-responsive card-body">
          <div class="col-md-12" >
              <table class="table dataTable" id="myTable2">
                  <thead>
                      <tr>
                          <th>Product</th>
                          <th>Amount</th>
                          <th>US$</th>
                      </tr>
                  </thead>
                  <tbody class="tbody">
                      <?= $tdata ?>
                  </tbody>
              </table>
          </div>				
      </div>					
  </div>
<?php
    }
?>

I think that is what you need

 

 

Now the table is all over the width of the screen and still above the input.

46 minutes ago, Barand said:

As a rule, output to the page generally happens in the same order that it appears in your code.

If you want the table after the form, output it after the form in your code. Not rocket science.

Got it!
Thanks again!! 👍🙂

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.