cikal/Demo.php

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

class Demo extends CI_Controller {

  public function __construct()
  {
    parent::__construct();
    $this->load->model('model_demo');
  }

  public function index()
  {
    $this->template->load('demo_view');
  }

  public function ambil_data()
  {
    header('Content-type: application/json');
    echo json_encode($this->model_demo->get_data());
  }

}

/* End of file Demo.php */
/* Location: ./application/controllers/Demo.php */

## demo_view.php
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Demo</title>
  <!--  Saya Extract hasil download jquery-easyui-1.5.1.zip ke folder bernama dist di root folder   -->
  <link rel="stylesheet" href="<?= base_url();?>dist/themes/bootstrap/easyui.css">
  <link rel="stylesheet" href="<?= base_url();?>dist/themes/icon.css">
  <link rel="stylesheet" href="<?= base_url();?>dist/css/demo.css">
  <script src="<?= base_url();?>dist/js/jquery.min.js"></script>
  <script src="<?= base_url();?>dist/js/jquery.easyui.min.js"></script>
</head>
<body>
  <h2>CodeIgniter &amp; ComboGrid</h2>
  <div style="margin:20px 0"></div>
  <div class="easyui-panel" style="width:100%;max-width:400px;padding:30px 60px;">
    <div style="margin-bottom:20px">
      <select class="easyui-combogrid" style="width:100%" data-options="
        panelWidth: 500,
        idField: 'kontak_id',
        textField: 'email',
        url: 'demo/ambil_data',
        method: 'post',
        columns: [[
          {field:'kontak_id',title:'#',width:30},
          {field:'nama',title:'Nama',width:80},
          {field:'username',title:'Nama Pengguna',width:110},
          {field:'email',title:'Email',width:150}
        ]],
        fitColumns: true,
        label: 'Pilih email:',
        labelPosition: 'top'
        ">
      </select>
    </div>
  </div>
</body>
</html>

## dump.sql
/*
Database : SQLite3
DB_Name : dbase.db
Desc : Hanya sekedar data contoh, biar lebih enak coding nya.
*/

CREATE TABLE `kontak` (
	`kontak_id`	INTEGER PRIMARY KEY AUTOINCREMENT,
	`nama`	TEXT,
	`username`	TEXT,
	`email`	TEXT
);
INSERT INTO `kontak` VALUES (1,'ian','iancikal','iancikal.bunda@gmail.com'),
 (2,'erwin','erwinweb','erwin@email.com');

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

class Model_demo extends CI_Model {

  public function get_data()
  {
    $query = $this->db->get('kontak');
    if ($query->num_rows() > 0) {
      return $query->result();
    } else {
      return FALSE;
    }
  }

}

/* End of file Model_demo.php */
/* Location: ./application/models/Model_demo.php */
	<?php
	defined('BASEPATH') OR exit('No direct script access allowed');

	class Demo extends CI_Controller {

	public function __construct()
	{
	parent::__construct();
	$this->load->model('model_demo');
	}

	public function index()
	{
	$this->template->load('demo_view');
	}

	public function ambil_data()
	{
	header('Content-type: application/json');
	echo json_encode($this->model_demo->get_data());
	}

	}

	/* End of file Demo.php */
	/* Location: ./application/controllers/Demo.php */
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<title>Demo</title>
	<!-- Saya Extract hasil download jquery-easyui-1.5.1.zip ke folder bernama dist di root folder -->
	<link rel="stylesheet" href="<?= base_url();?>dist/themes/bootstrap/easyui.css">
	<link rel="stylesheet" href="<?= base_url();?>dist/themes/icon.css">
	<link rel="stylesheet" href="<?= base_url();?>dist/css/demo.css">
	<script src="<?= base_url();?>dist/js/jquery.min.js"></script>
	<script src="<?= base_url();?>dist/js/jquery.easyui.min.js"></script>
	</head>
	<body>
	<h2>CodeIgniter & ComboGrid</h2>
	<div style="margin:20px 0"></div>
	<div class="easyui-panel" style="width:100%;max-width:400px;padding:30px 60px;">
	<div style="margin-bottom:20px">
	<select class="easyui-combogrid" style="width:100%" data-options="
	panelWidth: 500,
	idField: 'kontak_id',
	textField: 'email',
	url: 'demo/ambil_data',
	method: 'post',
	columns: [[
	{field:'kontak_id',title:'#',width:30},
	{field:'nama',title:'Nama',width:80},
	{field:'username',title:'Nama Pengguna',width:110},
	{field:'email',title:'Email',width:150}
	]],
	fitColumns: true,
	label: 'Pilih email:',
	labelPosition: 'top'
	">
	</select>
	</div>
	</div>
	</body>
	</html>
	/*
	Database : SQLite3
	DB_Name : dbase.db
	Desc : Hanya sekedar data contoh, biar lebih enak coding nya.
	*/

	CREATE TABLE `kontak` (
	`kontak_id` INTEGER PRIMARY KEY AUTOINCREMENT,
	`nama` TEXT,
	`username` TEXT,
	`email` TEXT
	);
	INSERT INTO `kontak` VALUES (1,'ian','iancikal','iancikal.bunda@gmail.com'),
	(2,'erwin','erwinweb','erwin@email.com');
	<?php
	defined('BASEPATH') OR exit('No direct script access allowed');

	class Model_demo extends CI_Model {

	public function get_data()
	{
	$query = $this->db->get('kontak');
	if ($query->num_rows() > 0) {
	return $query->result();
	} else {
	return FALSE;
	}
	}

	}

	/* End of file Model_demo.php */
	/* Location: ./application/models/Model_demo.php */