    <div class="row">
        <div class="col-12">
            <pre class="with-hljs"><code class="lang-php">&lt;?php
include(&quot;db/cn.php&quot;);
ini_set(&#039;display_errors&#039;, 1);
ini_set(&#039;display_startup_errors&#039;, 1);
error_reporting(E_ALL);

// Fetch user session details
if (isset($_SESSION[&#039;user_name&#039;], $_SESSION[&#039;user_role&#039;], $_SESSION[&#039;outlet_name&#039;], $_SESSION[&#039;outlet_address&#039;])) {
    $userName = $_SESSION[&#039;user_name&#039;];
    $userRole = $_SESSION[&#039;user_role&#039;];
    $outlet_address = $_SESSION[&#039;outlet_address&#039;];
    $outlet_name = $_SESSION[&#039;outlet_name&#039;];
}

// Initialize search variables
$ledgercode = $_POST[&quot;ledgercode&quot;] ?? &quot;&quot;;
$description = $_POST[&quot;description&quot;] ?? &quot;&quot;;
$startperiod = $_POST[&quot;startperiod&quot;] ?? &quot;&quot;;
$endperiod = $_POST[&quot;endperiod&quot;] ?? &quot;&quot;;

// Build SQL Query for entries
$sql = &quot;SELECT * FROM entries WHERE 1=1&quot;; // Start with a base query

if (!empty($ledgercode)) {
    $sql .= &quot; AND (ledger_code_dr = &#039;$ledgercode&#039; OR ledger_code_cr = &#039;$ledgercode&#039;)&quot;;
}
if (!empty($description)) {
    $sql .= &quot; AND (description_dr LIKE &#039;%$description%&#039; OR description_cr LIKE &#039;%$description%&#039;)&quot;;
}
if (!empty($startperiod) &amp;&amp; !empty($endperiod)) {
    $sql .= &quot; AND (postdate &gt;= &#039;$startperiod&#039; AND postdate &lt;= &#039;$endperiod&#039;)&quot;;
}

// Fetch the ledger opening balance based on the ledger code and description
$rec2 = mysqli_query($connection, 
    &quot;SELECT obalance 
     FROM ledger 
     WHERE (ledgecode = &#039;$ledgercode&#039; OR description LIKE &#039;%$description%&#039;)&quot;
);

$openb = 0; // Default opening balance
if ($rec2 &amp;&amp; mysqli_num_rows($rec2) &gt; 0) {
    $row2 = mysqli_fetch_array($rec2);
    $openb = $row2[&quot;obalance&quot;] ?? 0; // Set opening balance or default to 0
}

// Execute the query for entries
$rec3 = mysqli_query($connection, $sql);

// Handle the case when no results are returned
if (!$rec3 || mysqli_num_rows($rec3) === 0) {
    echo &quot;No entries found for the given criteria.&quot;;
}
?&gt;

&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;en&quot;&gt;

&lt;head&gt;

    &lt;meta charset=&quot;utf-8&quot;&gt;
    &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1, shrink-to-fit=no&quot;&gt;
    &lt;meta name=&quot;description&quot; content=&quot;&quot;&gt;
    &lt;meta name=&quot;author&quot; content=&quot;&quot;&gt;

    &lt;title&gt;Alfaizan Tax Consultant&lt;/title&gt;

    &lt;!-- Custom fonts for this template--&gt;
    &lt;link href=&quot;../vendor/fontawesome-free/css/all.min.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;&gt;
   &lt;link href=&quot;https://fonts.googleapis.com/css2?family=Quicksand:wght@200;300;400;500;600;700&amp;display=swap&quot; rel=&quot;stylesheet&quot;&gt;

    &lt;!-- Custom styles for this template--&gt;
    &lt;link href=&quot;../css/sb-admin-2.min.css&quot; rel=&quot;stylesheet&quot;&gt;
    
&lt;script src=&quot;https://cdn.jsdelivr.net/npm/chart.js&quot;&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;style&gt;
body {
    font-family: &#039;Quicksand&#039;, sans-serif;
    
}
		    .chart-container {
      position: relative;
      background: rgba(255, 255, 255, 0.9);
      border-radius: 10px;
      padding: 15px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    }

    canvas {
      max-width: 100%;
      height: auto;
    }
.bg-gradient-primary{
    
	background:#0A4657;
	color:#fff;	
	
	}

.btn-dark{
	background:#0A4657;
	color:#fff;
	 border:1px #0A4657 solid;
	
	}  
.btn-dark:hover{
  
  background:#fff;
  border:1px #0A4657 solid;
	color:#0A4657;
	
	}	 
    .chart-container {
      position: relative;
      background: rgba(255, 255, 255, 0.9);
      border-radius: 10px;
      padding: 15px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    }

    canvas {
      max-width: 100%;
      height: auto;
    }
	
	.fa-download:hover{
		color:#953E39;
		}
		
label{
    font-weight:600;
    color:#000;
}
.form-control{
    font-weight:500;
    color:#000;
}
.btn-dark{
    color:#fff;
    font-weight:700;
}

#table-container{
    max-height:410px;
    overflow-y:auto;
}
  &lt;/style&gt;

&lt;body id=&quot;page-top&quot;&gt;

    &lt;!-- Page Wrapper --&gt;
    &lt;div id=&quot;wrapper&quot;&gt;

        &lt;!-- Sidebar --&gt;
        &lt;?php
        include(&quot;common/sd.php&quot;);
		?&gt;
        &lt;!-- End of Sidebar --&gt;

        &lt;!-- Content Wrapper --&gt;
        &lt;div id=&quot;content-wrapper&quot; class=&quot;d-flex flex-column&quot;&gt;

            &lt;!-- Main Content --&gt;
            &lt;div id=&quot;content&quot;&gt;

                &lt;!-- Topbar --&gt;
                &lt;nav class=&quot;navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow&quot;&gt;

                    &lt;!-- Sidebar Toggle (Topbar) --&gt;
                    &lt;button id=&quot;sidebarToggleTop&quot; class=&quot;btn btn-link d-md-none rounded-circle mr-3&quot;&gt;
                        &lt;i class=&quot;fa fa-bars&quot;&gt;&lt;/i&gt;
                    &lt;/button&gt;

                    &lt;!-- Topbar Search --&gt;
                    
  &lt;?php include(&#039;common/log.php&#039;);  ?&gt;

                    &lt;!-- Topbar Navbar --&gt;
                    
                &lt;/nav&gt;
                &lt;!-- End of Topbar --&gt;

                &lt;!-- Begin Page Content --&gt;
&lt;div class=&quot;container-fluid&quot;&gt;
&lt;div class=&quot;container&quot; style=&quot;margin-top:20px;&quot;&gt;
                     &lt;div class=&quot;d-sm-flex align-items-center justify-content-between mb-4&quot;&gt;
                        &lt;h1 class=&quot;h3 mb-0 &quot; style=&quot;font-weight:700; color:#000;&quot;&gt;Ledger View&lt;/h1&gt;        
                    &lt;/div&gt;
&lt;/div&gt;     

&lt;div class=&quot;&quot;&gt;

                    &lt;div class=&quot;container-fluid&quot; &gt;
                    &lt;form action=&quot;report.php&quot; method=&quot;post&quot; enctype=&quot;multipart/form-data&quot;&gt;
                    &lt;div class=&quot;row&quot; style=&quot;&quot;&gt;
                    
                    &lt;div class=&quot;col-sm-1&quot;&gt;&lt;/div&gt;
                    &lt;div class=&quot;col-sm-10&quot; style=&quot;border:#ccc solid 1px; padding:30px; border-radius:20px;background-color:#F2F2F2; box-shadow: 0px 4px 10px rgba(10, 79, 99, 0.5);&quot;&gt;
                    &lt;div class=&quot;row&quot;&gt;
                        &lt;div class=&quot;col-4&quot;&gt;
                             &lt;h5 class=&quot;text-black&quot; style=&quot;color:#000; font-weight:700;&quot;&gt;Description
                        &lt;input type=&quot;text&quot; name=&quot;description&quot; id=&quot;description&quot; class=&quot;form-control&quot; style=&quot;width:280px;&quot; placeholder=&quot;Enter Description&quot; &gt;
                        &lt;/div&gt;
                        &lt;div class=&quot;col-4&quot;&gt;
                             &lt;span style=&quot;color:#000;font-weight:700;&quot;&gt;
                                 &amp;nbsp;Ledger Code:&amp;nbsp;
                        &lt;input type=&quot;text&quot; name=&quot;ledgercode&quot; id=&quot;ledgercode&quot; placeholder=&quot;Ledger Code &quot; class=&quot;form-control&quot; style=&quot;width:280px;&quot;&gt;&lt;/span&gt;&lt;/h5&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
                   
                   
                   
                    &lt;p&gt;Asset detial show data, this information will update soon&lt;/p&gt;
                        &lt;input type=&quot;hidden&quot; id=&quot;opening_balance&quot; value=&quot;&lt;?php echo $openb; ?&gt;&quot;&gt;
                    &lt;div class=&quot;row&quot;&gt;
                    &lt;div class=&quot;col-sm-7&quot;&gt; 
                   &lt;h5 class=&quot;&quot; style=&quot;color:#000;font-weight:700;&quot;&gt;Opening Balance -------- &lt;span class=&quot;opening-balance&quot;&gt;&lt;?php echo $openb; ?&gt;&lt;/span&gt;&lt;/h5&gt;
                    &lt;br&gt;
                   &lt;?php 
// Initialize variables to avoid undefined warnings
$ledgecode = $_POST[&#039;ledgercode&#039;] ?? &#039;&#039;; // Assuming it&#039;s from user input
$description = $_POST[&quot;description&quot;] ?? &#039;&#039;;

// Your SQL query to fetch data from the database
$sql = &quot;SELECT amount_dr FROM entries WHERE (ledger_code_dr = &#039;$ledgecode&#039; OR description_dr LIKE &#039;%$description%&#039;)&quot;;

if($_POST){
    $startperiod = $_POST[&quot;startperiod&quot;] ?? &#039;&#039;;
    $endperiod = $_POST[&quot;endperiod&quot;] ?? &#039;&#039;;
    $sql = &quot;SELECT amount_dr FROM entries WHERE (ledger_code_dr = &#039;$ledgecode&#039; OR description_dr LIKE &#039;%$description%&#039;) 
            AND postdate &gt;= &#039;$startperiod&#039; AND postdate &lt;= &#039;$endperiod&#039;&quot;;
}

$rec1 = $connection-&gt;query($sql);

// Initialize total amounts
$totalAmountDr = 0;

// Check if there are rows in the result
if ($rec1-&gt;num_rows &gt; 0) {
    // Loop through each row and accumulate totals
    while ($row1 = $rec1-&gt;fetch_assoc()) {
        $amountDr = $row1[&quot;amount_dr&quot;];
        // Accumulate total amounts
        $totalAmountDr += (int)$amountDr;
    }
}

$sql2 = &quot;SELECT amount_cr FROM entries WHERE (ledger_code_cr = &#039;$ledgecode&#039; OR description_cr LIKE &#039;%$description%&#039;)&quot;;

if($_POST){
    $startperiod = $_POST[&quot;startperiod&quot;] ?? &#039;&#039;;
    $endperiod = $_POST[&quot;endperiod&quot;] ?? &#039;&#039;;
    $sql2 = &quot;SELECT amount_cr FROM entries WHERE (ledger_code_cr = &#039;$ledgecode&#039; OR description_cr LIKE &#039;%$description%&#039;) 
            AND postdate &gt;= &#039;$startperiod&#039; AND postdate &lt;= &#039;$endperiod&#039;&quot;;
}

$rec6 = $connection-&gt;query($sql2);

// Initialize total amounts
$totalAmountCr = 0;

// Check if there are rows in the result
if ($rec6-&gt;num_rows &gt; 0) {
    // Loop through each row and accumulate totals
    while ($row5 = $rec6-&gt;fetch_assoc()) {
        $amountCr = $row5[&quot;amount_cr&quot;];
        // Accumulate total amounts
        $totalAmountCr += (int)$amountCr;
    }
}

// Calculate final closing balance
$closing_final = $openb + $totalAmountDr;
$close = $closing_final - $totalAmountCr;
?&gt;

                     

                   &lt;span style=&quot;font-size:14px;color:#064F6D;&quot;&gt;Total &lt;b style=&quot;color:#000;&quot;&gt;Debit(Dr)&lt;/b&gt; During the Period -------- &lt;span class=&quot;debit-total&quot;&gt;0 Dr&lt;/span&gt;&lt;/span&gt;&lt;br&gt;
                    &lt;span style=&quot;font-size:14px; color:#064F6D;&quot;&gt;Total &lt;b style=&quot;color:#000;&quot;&gt;Credit(Cr)&lt;/b&gt; During the Period -------- &lt;span class=&quot;credit-total&quot;&gt;0 Cr&lt;/span&gt;&lt;/span&gt;
                    
                    &lt;br&gt;&lt;br&gt;
                    &lt;/div&gt;
                    &lt;div class=&quot;col-sm-5&quot;&gt;
&lt;h5 class=&quot;&quot; style=&quot;color:#000;font-weight:700;&quot;&gt;Closing Balance -------- &lt;span class=&quot;closing-balance&quot;&gt;0&lt;/span&gt;&lt;/h5&gt;
                    
                    &lt;/div&gt;
                    &lt;/div&gt;
                    &lt;div class=&quot;row&quot;&gt;
                     &lt;div class=&quot;col-sm-3&quot; style=&quot;color:#000; font-weight:700; &quot;&gt;
                     
                     
                      Period From&lt;br&gt;
                      Start From &lt;br&gt;                 
                    &lt;input type=&quot;date&quot; class=&quot;form-control&quot; name=&quot;startperiod&quot; /&gt;
                     &lt;/div&gt;
                     &lt;div class=&quot;col-sm-4&quot; style=&quot;color:#000; font-weight:700; &quot;&gt;
                     &lt;br&gt;End From&lt;br&gt;
                    &lt;input type=&quot;date&quot; class=&quot;form-control&quot; name=&quot;endperiod&quot; /&gt;
                    
                     &lt;/div&gt;
                     &lt;div class=&quot;col-sm-5&quot;&gt;
                     &lt;br&gt;&lt;br&gt;
                     &lt;button type=&quot;submit&quot; class=&quot;btn btn-dark&quot; style=&quot;width:120px; border-radius:20px;&quot;&gt;Get&lt;/button&gt;
                     &lt;button id=&quot;downloadExcel&quot; type=&quot;button&quot; class=&quot;btn btn-dark&quot; style=&quot;width:120px; border-radius:20px;&quot;&gt;Download&lt;/button&gt;
                     &lt;a href=&quot;report.php&quot; class=&quot;btn btn-dark&quot; style=&quot;width:120px; border-radius:20px;&quot;&gt;&lt;i class=&quot;fas fa-sync fa-1x&quot;&gt;&lt;/i&gt;&lt;/a&gt;
                     &lt;/div&gt;
                    
                    &lt;/div&gt;
                    
                    
                    
                    &lt;/div&gt;
                    &lt;div class=&quot;col-sm-1&quot;&gt;&lt;/div&gt;
                    &lt;/div&gt;
                    &lt;/div&gt;
                    
                    &lt;div class=&quot;row&quot;&gt;
                    &lt;div class=&quot;col-sm-1&quot;&gt;&lt;/div&gt;
                    &lt;div class=&quot;col-sm-10&quot;&gt;
                    &lt;br&gt;&lt;br&gt;
                    
                   &lt;p style=&quot;font-weight:700; font-size:23px;color:#000;&quot;&gt; Accounting Entries&lt;/p&gt;

&lt;div class=&quot;table-responsive&quot; id=&quot;table-container&quot;&gt;
&lt;table id=&quot;ledgertable&quot; class=&quot;table table-bordered text-center bg-white &quot; style=&quot;color:#000; font-weight:700;&quot;&gt;
    &lt;thead&gt;
    &lt;tr class=&quot;&quot; style=&quot;font-weight:800;&quot;&gt;
        &lt;th style=&quot;color:#fff;background:#064F6D;&quot;&gt; Entry No&lt;/th&gt;
        &lt;th style=&quot;color:#fff;background:#064F6D;&quot;&gt;Ledger Code&lt;/th&gt;
        &lt;th style=&quot;color:#fff;background:#064F6D;&quot;&gt;Ledger category&lt;/th&gt;
        &lt;th style=&quot;color:#fff;background:#064F6D;&quot;&gt;Description&lt;/th&gt;
        
        &lt;th style=&quot;color:#fff;background:#064F6D;&quot;&gt;Amount Dr&lt;/th&gt;
        &lt;th style=&quot;color:#fff;background:#064F6D;&quot;&gt;Amount Cr&lt;/th&gt;
    &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody &gt;

    &lt;?php
	$sr_no = 1;
    while ($row3 = mysqli_fetch_array($rec3)) {
        ?&gt;
        &lt;tr&gt;
            &lt;td  class=&quot;bg-dark text-white&quot;&gt;&lt;?php echo $row3[&quot;id&quot;]; ?&gt;&lt;/td&gt;
            &lt;td&gt;&lt;?php echo $row3[&quot;ledger_code_dr&quot;]; ?&gt;&lt;/td&gt;
            &lt;td style=&quot;&quot;&gt;&lt;?php echo $row3[&quot;ledger_category_dr&quot;]; ?&gt;&lt;/td&gt;
            &lt;td style=&quot;text-transform:capitalize; color:#0A4657; font-weight:900;&quot;&gt;&lt;?php echo $row3[&quot;description_dr&quot;]; ?&gt;&lt;/td&gt;
          
            &lt;td&gt;&lt;?php echo $row3[&quot;amount_dr&quot;]; ?&gt;&lt;/td&gt;
            &lt;td&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td th class=&quot; text-white&quot; style=&quot;background:#0A4F63;&quot;&gt;&lt;?php echo  $row3[&quot;id&quot;]; ?&gt;&lt;/td&gt;
            &lt;td &gt;&lt;?php echo $row3[&quot;ledger_code_cr&quot;]; ?&gt;&lt;/td&gt;
            &lt;td style=&quot;color:#0A4657;&quot;&gt;&lt;?php echo $row3[&quot;ledger_category_cr&quot;]; ?&gt;&lt;/td&gt;
            &lt;td style=&quot;text-transform:capitalize; color:#567043;font-weight:900;&quot;&gt;&lt;?php echo $row3[&quot;description_cr&quot;]; ?&gt;&lt;/td&gt;
           
            &lt;td&gt;&lt;/td&gt;
            &lt;td&gt;&lt;?php echo $row3[&quot;amount_cr&quot;]; ?&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;?php
    }
    ?&gt;
    &lt;/tbody&gt;
&lt;/table&gt;
&lt;/div&gt;
          &lt;/div&gt;
                    &lt;div class=&quot;col-sm-1&quot;&gt;&lt;/div&gt;
                    &lt;/div&gt;
                    &lt;/form&gt;
                  


 &lt;/div&gt;



&lt;/div&gt;  

                &lt;!-- /.container-fluid --&gt;

            &lt;/div&gt;
            &lt;br&gt;&lt;br&gt;
            &lt;!-- End of Main Content --&gt;

            &lt;!-- Footer --&gt;
            &lt;?php include(&quot;common/main_ft.php&quot;);  ?&gt;
            &lt;!-- End of Footer --&gt;

        &lt;/div&gt;
        &lt;!-- End of Content Wrapper --&gt;

    &lt;/div&gt;
    &lt;!-- End of Page Wrapper --&gt;

    &lt;!-- Scroll to Top Button--&gt;
    &lt;a class=&quot;scroll-to-top rounded&quot; href=&quot;#page-top&quot;&gt;
        &lt;i class=&quot;fas fa-angle-up&quot;&gt;&lt;/i&gt;
    &lt;/a&gt;

    &lt;!-- Logout Modal--&gt;
    &lt;div class=&quot;modal fade&quot; id=&quot;logoutModal&quot; tabindex=&quot;-1&quot; role=&quot;dialog&quot; aria-labelledby=&quot;exampleModalLabel&quot;
        aria-hidden=&quot;true&quot;&gt;
        &lt;div class=&quot;modal-dialog&quot; role=&quot;document&quot;&gt;
            &lt;div class=&quot;modal-content&quot;&gt;
                &lt;div class=&quot;modal-header&quot;&gt;
                    &lt;h5 class=&quot;modal-title&quot; id=&quot;exampleModalLabel&quot;&gt;Ready to Leave?&lt;/h5&gt;
                    &lt;button class=&quot;close&quot; type=&quot;button&quot; data-dismiss=&quot;modal&quot; aria-label=&quot;Close&quot;&gt;
                        &lt;span aria-hidden=&quot;true&quot;&gt;×&lt;/span&gt;
                    &lt;/button&gt;
                &lt;/div&gt;
                &lt;div class=&quot;modal-body&quot;&gt;Select &quot;Logout&quot; below if you are ready to end your current session.&lt;/div&gt;
                &lt;div class=&quot;modal-footer&quot;&gt;
                    &lt;button class=&quot;btn btn-secondary&quot; type=&quot;button&quot; data-dismiss=&quot;modal&quot;&gt;Cancel&lt;/button&gt;
                    &lt;a class=&quot;btn btn-primary&quot; href=&quot;&quot;&gt;Logout&lt;/a&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;


&lt;/div&gt;    
&lt;/body&gt;
 &lt;script src=&quot;https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js&quot;&gt;&lt;/script&gt;
 &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js&quot;&gt;&lt;/script&gt;

   &lt;script src=&quot;https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js&quot;&gt;&lt;/script&gt;
    &lt;!-- Bootstrap core JavaScript--&gt;
    &lt;script src=&quot;../vendor/jquery/jquery.min.js&quot;&gt;&lt;/script&gt;
    &lt;script src=&quot;../vendor/bootstrap/js/bootstrap.bundle.min.js&quot;&gt;&lt;/script&gt;

    &lt;!-- Core plugin JavaScript--&gt;
    &lt;script src=&quot;../vendor/jquery-easing/jquery.easing.min.js&quot;&gt;&lt;/script&gt;

    &lt;!-- Custom scripts for all pages--&gt;
    &lt;script src=&quot;../js/sb-admin-2.min.js&quot;&gt;&lt;/script&gt;
    &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.9/xlsx.full.min.js&quot;&gt;&lt;/script&gt;
&lt;script&gt;
    // Function to reset totals to zero (or show null/zero if the filter hasn&#039;t run)
    function resetTotals() {
        document.querySelector(&#039;.opening-balance&#039;).textContent = &#039;0&#039;;
        document.querySelector(&#039;.debit-total&#039;).textContent = &#039;0 Dr&#039;;
        document.querySelector(&#039;.credit-total&#039;).textContent = &#039;0 Cr&#039;;
        document.querySelector(&#039;.closing-balance&#039;).textContent = &#039;0&#039;;
    }

    // Initial reset to zero when the page loads (before any filtering)
    document.addEventListener(&#039;DOMContentLoaded&#039;, function() {
        resetTotals();
    });

    // Event listener for form submission (filter application)
    document.querySelector(&#039;form&#039;).addEventListener(&#039;submit&#039;, function(event) {
        event.preventDefault(); // Prevent form submission to avoid page reload

        // Get input values for filtering
        const description = document.getElementById(&#039;description&#039;).value.toLowerCase();
        const ledgerCode = document.getElementById(&#039;ledgercode&#039;).value.toLowerCase();
        const startPeriod = document.querySelector(&#039;input[name=&quot;startperiod&quot;]&#039;).value;
        const endPeriod = document.querySelector(&#039;input[name=&quot;endperiod&quot;]&#039;).value;

        // Fetch the opening balance from the hidden input
        const openingBalance = parseFloat(document.getElementById(&#039;opening_balance&#039;).value) || 0;

        // Initialize variables to store calculated totals
        let totalDebit = 0;
        let totalCredit = 0;
        let rowCount = 0; // Keep track of how many rows are visible after filtering

        // Get all table rows from the ledger table
        const rows = document.querySelectorAll(&#039;#ledgertable tbody tr&#039;);

        // Loop through each row and apply the filtering conditions
        rows.forEach(function(row) {
            const ledgerCodeDr = row.cells[1].textContent.toLowerCase();
            const ledgerCodeCr = row.cells[6] ? row.cells[6].textContent.toLowerCase() : &#039;&#039;; // Some rows may not have a credit cell
            const descriptionDr = row.cells[3].textContent.toLowerCase();
            const descriptionCr = row.cells[7] ? row.cells[7].textContent.toLowerCase() : &#039;&#039;; // Some rows may not have a credit description
            const postDate = new Date(row.cells[0].textContent); // Assuming the entry date is in the first column

            let showRow = true;

            // Apply description and ledger code filters
            if (description &amp;&amp; !(descriptionDr.includes(description) || descriptionCr.includes(description))) {
                showRow = false;
            }
            if (ledgerCode &amp;&amp; !(ledgerCodeDr.includes(ledgerCode) || ledgerCodeCr.includes(ledgerCode))) {
                showRow = false;
            }

            // Apply date range filter
            if (startPeriod &amp;&amp; endPeriod &amp;&amp; (postDate &lt; new Date(startPeriod) || postDate &gt; new Date(endPeriod))) {
                showRow = false;
            }

            // Show or hide the row based on filter results
            if (showRow) {
                row.style.display = &#039;&#039;; // Show row if it matches filters
                rowCount++; // Count visible rows

                // Add the debit and credit amounts from the visible rows
                const debit = parseFloat(row.cells[4].textContent) || 0; // Debit in 5th cell
                const credit = parseFloat(row.cells[5].textContent) || 0; // Credit in 6th cell

                totalDebit += debit;
                totalCredit += credit;
            } else {
                row.style.display = &#039;none&#039;; // Hide row if it doesn&#039;t match filters
            }
        });

        // Calculate the closing balance only if there are matching rows, else set to 0
        const closingBalance = rowCount &gt; 0 ? (openingBalance + totalDebit - totalCredit) : 0;

        // Update the page with recalculated values or set to 0 if no rows are visible
        if (rowCount &gt; 0) {
            document.querySelector(&#039;.opening-balance&#039;).textContent = openingBalance.toFixed(2);
            document.querySelector(&#039;.debit-total&#039;).textContent = totalDebit.toFixed(2) + &#039; Dr&#039;;
            document.querySelector(&#039;.credit-total&#039;).textContent = totalCredit.toFixed(2) + &#039; Cr&#039;;
            document.querySelector(&#039;.closing-balance&#039;).textContent = closingBalance.toFixed(2);
        } else {
            resetTotals(); // Reset totals to zero if no matching rows
        }
    });
&lt;/script&gt;



&lt;script&gt;
    document.getElementById(&#039;downloadExcel&#039;).addEventListener(&#039;click&#039;, function() {
        // Get the table element
        var table = document.getElementById(&#039;ledgertable&#039;);

        // Clean the table to avoid potential issues with hidden rows or formatting
        var clone = table.cloneNode(true); // Clone the table
        var rows = clone.querySelectorAll(&#039;tr&#039;);

        // Remove hidden or empty rows if necessary
        rows.forEach(function(row) {
            if (row.style.display === &#039;none&#039; || row.innerText.trim() === &#039;&#039;) {
                row.remove();
            }
        });

        // Convert the table into a worksheet using SheetJS
        var workbook = XLSX.utils.table_to_book(clone, { sheet: &quot;Ledger View&quot; });

        // Export the Excel file with a proper name
        try {
            XLSX.writeFile(workbook, &#039;Ledger_view.xlsx&#039;);
        } catch (error) {
            console.error(&quot;Error while writing the file: &quot;, error);
            alert(&quot;Error generating Excel file. Please check if the SheetJS library is properly loaded.&quot;);
        }
    });
&lt;/script&gt;
&lt;/body&gt;

&lt;/html&gt;</code></pre>        </div>
    </div>