如何使用 CI 和 Morris 在 1 个视图中制作视图 table 和图形

Question

所以我评估了使用 Codeigniter 和 Morris.js、

在 1 个视图中创建视图 table 和图形

但是如何在 1 个视图中显示？我只能在 2 个视图中完成。

这是我的控制器型号

    <?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Uas extends CI_Controller{
    function __construct(){
      parent::__construct();
      //load chart_model from model
      $this->load->model('uas_model');
}
    function index(){
        $data['table'] = $this->uas_model->list_table()->result();
        $this->load->view('index',$data);
    }
    function testing(){
      $data = $this->uas_model->get_data()->result();
      $x['data'] = json_encode($data);
       $this->load->view('coba',$x);
    }

<?php 
class Uas_model extends CI_Model{

    function list_table(){
        $table = $this->db->get('account');
        return $table;
    }
    function get_data(){
        $this->db->select('year,purchase,sale,profit');
        $result = $this->db->get('account');
        return $result;
    }
}

我试着让这一切都在视野中 index.php。我已经在下面尝试过，但没有用

function index(){
        $data['table'] = $this->uas_model->list_table()->result();
        $datachart = $this->uas_model->get_data()->result();
        $x['data'] = json_encode($datachart);
        $this->load->view('index',$data,$x);
    }

这是我的观点代码

index.php

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
    <title>CRUD CI List</title>
  <link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/bootstrap.min.css'); ?>">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-info">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link"<?php echo anchor('uas/input','INPUT DATA') ?></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Input Data</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Grafik</a>
      </li>
    </ul>
  </div>
</nav>

<div class="jumbotron jumbotron-fluid">
  <div class="container">
    <h1 class="display-4">Fluid jumbotron</h1>
    <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  </div>
</div>
<div class="container">
<center><table class="table table-bordered"><thead class="thead-dark">
    <tr><th scope="col">ID</th><th scope="col">YEAR</th><th scope="col">PURCHASE</th><th scope="col">SALE</th><th scope="col">PROFIT</th><th scope="col">EDIT</th><th scope="col">DELETE</th></tr></thead>
    <?php 
    foreach($table as $t)
        echo "<tr>
            <td>$t->kode_id</td>
            <td>$t->year</td>
            <td>$t->purchase</td>
            <td>$t->sale</td>
            <td>$t->profit</td>
            <td>".anchor('uas/edit/'.$t->kode_id,'EDIT')."</td>
            <td>".anchor('uas/delete/'.$t->kode_id,'DELETE')."</td>
            </tr>"
     ?>
</table>

<?php echo anchor('uas/testing','LIHAT GRAFIK') ?>
</center></div>
<br><br>
</body>
</html>

coba.php（图表）

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ste</title>
    <link rel="stylesheet" href="<?php echo base_url('assets/css/morris.css') ?>">
    <link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/bootstrap.min.css'); ?>">
</head>
<body>
<div class="jumbotron jumbotron-fluid">
  <div class="container">
    <h1 class="display-4">Fluid jumbotron</h1>
    <p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  </div>
</div>
<h2>Chart using Codeigniter and Morris.js</h2>

<div id="wkwk"></div>

<script src="<?php echo base_url('assets/js/jquery.min.js') ?>"></script>
<script src="<?php echo base_url('assets/js/morris.min.js') ?>"></script>
<script src="<?php echo base_url('assets/js/raphael-min.js') ?>"></script>

<script>
    Morris.Area({
        element:'wkwk',
        data: <?php echo $data;?>,
        xkey: 'year',
        ykeys: ['purchase', 'sale', 'profit'],
        labels: ['Purchase', 'Sale', 'Profit']
    });
</script>

<?php echo anchor('uas','KEMBALI') ?>
</body>
</html>

Answer 1

就这样，效果很好

function index(){
    $data = $this->uas_model->get_data()->result();
    $data['data'] = json_encode($data);
    $data['table'] = $this->uas_model->list_table()->result();
    $this->load->view('index',$data);

如何使用 CI 和 Morris 在 1 个视图中制作视图 table 和图形

How to make view table and graph in 1 view with CI and Morris

php

codeigniter

charts

morris.js