How to load EXCEL Data in Browser in PHP

PhpSpreadsheet is a library written in pure PHP and offers a set of classes that allow you to read and write various spreadsheet file formats such as Excel and LibreOffice Calc.

Installation

Use composer to install PhpSpreadsheet into your project:

composer require phpoffice/phpspreadsheet
Download Source Code of the Project:-
Php Spreadsheet project 

So first we will create a index.php page 

 

<!DOCTYPE html>
<html>
   <head>
     <title>Insert EXCEL Data into Database using PHP-AJAX ( Using PHP Spreadsheet )</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
   </head>
   <body>
     <div class="container">
      <br />
      <h3 align="center">Insert Excel Data using PHP-AJAX ( Using PHP Spreadsheet )</h3>
      <br />
      <div class="table-responsive">
       <span id="message"></span>
          <form method="post" id="load_excel_data"  enctype="multipart/form-data">
            <table class="table">
              <tr>
            
                <td width="25%" align="right">Choose File</td>
                <td width="50%"><input type="file" id="select_excel" name="select_excel" /></td>
                <!-- <input type="hidden" name="file_content" id="file_content" /> -->
                <td width="25%"><input type="submit" id="load" name="load" class="btn btn-primary" /></td>
              </tr>
              <input type="hidden" name="file_content" id="file_content" value=""/>
             
            </table>
              <table class="table" id="show_excel_data">
              </table>
           </form>
        <br />

      </div>
     </div>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
  </body>
</html>

<script>
$(document).ready(function(){
  $('#load_excel_data').on('submit', function(event){
    event.preventDefault();
    $.ajax({
      url:"fetch_rquest.php",
      method:"POST",
      data:new FormData(this), // It automatically capture form data 
      contentType:false, // contentType When sending data to the server, use this content type.
      cache:false,
      processData:false,
      success:function(data)
      {
        $('#show_excel_data').html(data);
        $('table').css('width','100%');

        
        var table_content = $('#show_excel_data').html();
        $('#file_content').val(table_content);
 
        var datass = $('#file_content').val();

       //$('#load_excel_data').submit();

        $.ajax({
          url:"read_html.php",
          method:"POST",
          data:{file_content:datass}, // It automatically capture form data 
          dataType:'text',
          success:function(datas)
          {
               
          }
      });
    }
   }); 
  });
});
 
</script>

Now we will create the page fetch_request.php . This page will convert EXCEL Data into HTML Data

<?php

//upload.php

include 'spreadsheet/vendor/autoload.php';

use PhpOffice\PhpSpreadsheet\IOFactory;
use PhpOffice\PhpSpreadsheet\Spreadsheet;

if($_FILES["select_excel"]["name"] != '')
 {
  
  
  $allowed_extension = array('xls', 'xlsx');
  $file_array = explode(".", $_FILES['select_excel']['name']);
  $file_extension = end($file_array);
   if(in_array($file_extension, $allowed_extension))
    {
     $reader = IOFactory::createReader('Xlsx'); // :: Scope Resolution , is a token that allows access to static, constant, and overridden properties or methods of a class.
     $spreadsheet = $reader->load($_FILES['select_excel']['tmp_name']);
     $writer = IOFactory::createWriter($spreadsheet, 'Html');
     $message = $writer->save('php://output');
 
    //  code for wrting data into tmp_html
    //  $data = $_POST["file_content"];
    //  $temporary_html_file = './tmp_file/' . time()  . '.html';
    //  $htmlContent = file_put_contents($temporary_html_file, $_POST["file_content"]);
     
    }
   else
   {
     $message = '<div class="alert alert-danger">Only .xls or .xlsx file allowed</div>';
   }

}
else
{
   $message = '<div class="alert alert-danger">Please Select File</div>';
}

echo $message;

  

?>

Leave a Reply

Your email address will not be published. Required fields are marked *