jEasyUI - A jQuery Framework For a Good and Easier Backend development

jQuery EasyUI framework helps you build your web pages easily.

  • easyui is a collection of user-interface plugin based on jQuery.
  • easyui provides essential functionality for building modern, interactive, javascript applications.
  • using easyui you don't need to write many javascript code, you usually defines user-interface by writing some HTML markup.
  • complete framework for HTML5 web page.
  • easyui save your time and scales while developing your products.
  • easyui is very easy but powerful.

its currently still not supporting a responsive design but I hope the developer will do it soon. jEasyUI is good for a Backend system (as i think its aimed for). some cool features i use most are Datagrid, Layout, Combogrid and Calender. Datagrid is probably the most wanted thing to make our live easier. Its 'fully' customizable, Ajax support, cool pagination etc.

Here some screenshots



Combogrid, dynamic combobox with a filter


here's an example of code to display data into Datagrid in PHP - Codeigniter

public function get_product() {

$offset = isset($_POST['page']) ? intval($_POST['page']) : 1;
$limit = isset($_POST['rows']) ? intval($_POST['rows']) : 10;
$search= isset($_POST['search']) ? $_POST['itemid'] : '';
$offset = ($offset-1)*$limit;
$data = $this->master_data_model->get_product($offset,$limit,$search);
$i = 0;
$rows = array();
foreach ($data ['product'] as $r) {
$rows[$i]['code'] = $r->code;
$rows[$i]['product_name'] = $r->product_name;
$rows[$i]['price'] = $r->price;

echo json_encode(array('total'=>$data['count'],'rows'=>$rows));

<table id="dg" title="Product" class="easyui-datagrid" style="width:auto;height:400px"
url="<?php echo base_url().'index.php/master_data/get_product'?>" toolbar="#toolbar" pagination="true" rownumbers="false" fitColumns="true" singleSelect="true" checkBox="true" striped="true" remoteSort="false" nowrap="false">
<th field="ck" checkbox="true"></th>
<th field="code" width="200" sortable="true"> <b>Code</b> </th>
<th field="product_name" width="700" sortable="true"> <b>Product Name</b> </th>
<th field="price" width="100" sortable="true"> <b>Price</b> </th>

</thead> </table>

Complete Online demo and Documentation

That's it. Try it now :D