How to separate the code from [controller] into [view]?

[eluser]chiquitta[/eluser]
I am new in Codeigniter!
I use PHPexcel to upload , read and insert data to my database
but i don't know how to use [view] i only use [model] and [controller]
i cant understand how to separate the code into [view].
so I did a stupid way to deal with, but it's very ugly without any css.
please help me!

Code:

function read()
{  
       $rows = array('id','sku','name','description','created_on','enabled');
       $KeyWord_sku =  'sku';  
       $KeyWord_mac =  'name';  
       $KeyWord_des =  'description';
    $fileName   = EXCELFILE_PATH.'MyExcel.xlsx';
    $filename = $_FILES['userfile']['name'];
       $Exsel_data  = $this->excel->read($fileName,$rows);  
       //$this->FilterExsel($Exsel_data,$KeyWord_sku);  
       $DB_data    =    $this->mexcel->selUsers();

       if(!empty($DB_data))
       {
   //$this->load->view('preview_form',$Exsel_data);
            $DataKeyArray   =  $this->getKeyValue($DB_data,$KeyWord_sku,$KeyWord_mac,$KeyWord_des);
            $dataChange     =  $this->dataChange($DB_data,$KeyWord_sku,$KeyWord_mac,$KeyWord_des);  
       }

    echo '<table border=1>
    <tr>
    <th colspan=4>'.$filename.'</th>
    </tr>
    <tr>
   <th>Serial Number</th>
   <th>mac</th>
   <th>description</th>
   <th>status</th>
  </tr>';
  
       foreach($Exsel_data as $Ekey =>$Evalue)
       {    
            if(!$this->arrayEmpty($Evalue))
            {
    
                if(!empty($DB_data) && $this->isExist($Evalue,$KeyWord_sku,$DataKeyArray))
                {  

                    if(!$this->isChange($Evalue,$dataChange,$KeyWord_sku))
                    {  
  
                       echo '<td>'.$Evalue[$KeyWord_sku].'</td><td>'.$Evalue[$KeyWord_mac].'</td><td><center>'.$Evalue[$KeyWord_des].'</center></td><td>Already exist.<tr>';
                    }
                }
                else
                {  
                    if($this->addExcel($Evalue))
                    echo 'add data：'.$Evalue[$KeyWord_sku].' '.$Evalue[$KeyWord_mac].' '.$Evalue[$KeyWord_des].' success'.'<br>';    
                }
                
                
            }
       }

    echo '</table>';
       //echo 'data import success';
  
    }

[eluser]CroNiX[/eluser]
Basically the view is any html and what is needed to generate the final output.

You pass variables to the view using an array with key/value pairs. The key will become the variable in the view.

Here's an simple example just using straight variables. Normally you'd be retrieving these from the database, etc., but you'd assign them to the array the same way by setting a key that then gets accessed in the view.

//controller

Code:

function display()
{
  //create the array of dynamic data we will pass to the view
  $data['page_title'] = 'my page title'; //this will be available as $page_title in the view
  $data['exsel_data'] = array('one', 'two', 'three');  //this array will be available as $exsel_data

  //load the view and send the data to it
  $this->load->view('your_view', $data);
}

The view
/application/views/your_view.php

Code:

//output the page title in a div
<div>&lt;?php echo $page_title; ?&gt;</div>

//create a UL from the $exsel_data array
<ul>
  &lt;?php foreach($exsel_data as $exsel): ?&gt;
  <li>&lt;?php echo $exsel; ?&gt;</li>
  &lt;?php endforeach; ?&gt;
</ul>

Now all of your HTML is separate from your controller, and appears as pure html (instead of echoing php strings as html). The controller only gathers data, like from models, to pass to the view but doesn't have anything directly to do with the HTML output. That's all contained separately in views.

You can also load multiple views. Like one view can contain the header information, another one contain the body (the part that will most likely change from page to page) and another contain the footer. Then you just load them in order to create the full page.