• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Ignited DataTables

#1
[eluser]cryogenix[/eluser]
Ignited Datatables is a wrapper class/library based on the native Datatables server-side implementation by Allan Jardine found at datatables[dot]net/examples/data_source/server_side.html for CodeIgniter

FEATURES:

1. Easy to use. Generates json using only a few lines of code.
2. Support for table joins (left, right, outer, inner, left outer, right outer).
3. Able to define custom columns, and filters.
4. Editable custom variables with callback function support.

RESOURCES:

Fork: github[dot]com/IgnitedDatatables/Ignited-Datatables
Wiki: github[dot]com/IgnitedDatatables/Ignited-Datatables/wiki

Native PHP Version: github[dot]com/n1crack/IgnitedDatatables-native-php-version

NOTES:

~ I have removed the download link here in favor of the regularly updated git repository
~ Sorry for the un-hyperlinked urls because the forums have gotten much stricter now =(

#2
[eluser]cryogenix[/eluser]
CHANGELOG:
07-29-11 : Version 0.6 includes some bug fixes and support for non utf-8 charsets.
06-30-11 : Ignited Datatables v0.5.3 released, added mDataProp support for Datatables v1.8.1+
05-31-11 : pushed v0.5 refactoring the source to use active record instead of native sql
05-20-11 : launch of version 0.4 with a complete library overhaul in favor of method chaining and active record usage style
05-08-11 : released version 0.3 with bug fixes and refactored codes
04-11-11 : launch of Ignited Datatables version 0.2 with support for joins, custom columns, filters, and many more
03-04-11 : started a git collab project with petroz for an improved library targeting joins and other new features
10-12-10 : added initial draft for library version (no joins yet sobs…)
10-04-10 : fixed minor bug for get_ordering as smcmillan pointed out.
09-14-10 : added pointers on how to customize table results in the produce_output method of the datatables model.
08-31-10 : added paging fix as loba suggested,
changed iTotal implementation in the model from “id” to $index since the default index can be any other column.
07-26-10 : simplified json output implementation as audiopleb suggested.

#3
[eluser]johnwbaxter[/eluser]
Instead of building the json in that crazy way it would make much more sense to just create an array with your values and..

Code:
echo json_encode($your_array);

#4
[eluser]cryogenix[/eluser]
post updated. thank you for your suggestion. *i initially only copy-pasted the given datatables code so i never really tinkered much on the code aside from the get switched to post

#5
[eluser]johnwbaxter[/eluser]
No problem, it makes the code so much more readable too!

#6
[eluser]Unknown[/eluser]
great posting here, cryogenix

I just paste the code and its work perfect(almost), just one additional fix for get_pagging function on model, instead using 'if' only I add 'else' to make tables when loaded for the first time not display the whole records, it may looks like these:

Quote:if($this->input->post("iDisplayStart") && $this->input->post("iDisplayLength") != "-1")
$sLimit = "LIMIT " . $this->input->post("iDisplayStart") . ", " . $this->input->post("iDisplayLength");
else
{
$sLimit = "LIMIT " . "0" . ", " . $this->input->post("iDisplayLength");
}

return $sLimit;

overall all other functions is working great, thank you for making post here

#7
[eluser]ruizpi[/eluser]
I HAVE A PROBLEM WITH THIS COMPONENT. I WANT TO DO A SERVER SIDE GRID BUT IT DOESNT WORK.
MY VIEW IS:

<html >
<head>
<title><?php $titulo_pagina?></title>

<link rel="stylesheet" href="../css/misclases.css" type="text/css" />
<link rel="stylesheet" href="../../../css/demo_table.css" type="text/css" />
<link rel="stylesheet" href="../../../css/demo_page.css" type="text/css" />
[removed][removed]
[removed][removed]
[removed]
/* $(document).ready(function() {
$('#example').dataTable();

} );*/
// This is a very simple demo that shows how a range of elements can
// be paginated.
// The elements that will be displayed are in a hidden DIV and are
// cloned for display. The elements are static, there are no Ajax
// calls involved.

/**
* Callback function that displays the content.
*
* Gets called every time the user clicks on a pagination link.
*
* @param {int} page_index New Page index
* @param {jQuery} jq the container with the pagination links as a jQuery object
*/


$(document).ready(function()
{
$('#example').dataTable
({
"bProcessing" : true,
"bServerSide" : true,
"sAjaxSource" : "<?php echo base_url();?>ethyria/listener",
"iDisplayStart" : 10,
"fnServerData": function(sSource, aoData, fnCallback)
{
$.ajax(
{
'dataType': 'json',
'type' : 'POST',
'url' : sSource,
'data' : aoData,
'success' : fnCallback
}
);
}

});

});
[removed]




</head>
<body>
<div id="Contenedor">
<div id="BarraIzq">
<img src='/images/logopine.png' border='0' width='150' height='60' alt='logopine.png (1.095 bytes)'>
&lt;?php echo br(3);?&gt;
<table align="center" class="MiTablaMenu">
<tr>
<td class="TDMenu"><font class="MiFuenteTituloMenu">MENU</font></td>
</tr>
<tr>
<td class="CeldaTransparente">&lt;?php echo nbs(2);?&gt;</td>
</tr>
<tr>
<td class="TDMenu">
&lt;?php
$Opcion1 = "TAGSMCR";
echo anchor('/ethyria/VerTagsMcr',"<button type='submit' class='MiBotonPine'>".$Opcion1."</button>", array('class' => 'SinSubrayadoEnlace'));
?&gt;
</td>
</tr>
<tr>
<td class="TDMenu">
&lt;?php
$Opcion1 = "OPCION 2";
echo anchor('/ethyria/VerTagsMcr',$Opcion1,array('class' =>'MiBotonPine'));
?&gt;
</td>
</tr>
<tr>
<td class="TDMenu">
&lt;?php
$Opcion1 = "OPCION 3";
echo anchor('/ethyria/VerTagsMcr',$Opcion1,array('class' =>'MiBotonPine'));
?&gt;
</td>
</tr>

</table>
</div>
<div id="BarraSup">
<font class="MainFuente">Ethyria Web Access</font>
</div>
<div id="MarcoInterior">

&lt;?php
if (isset($consulta))
{

echo "<table id='example' class='display'>";
echo "<thead>";
echo "<tr><th>Obra</th><th>Id</th><th>Tagno</th><th>IdSistema</th><th>Descripcion</th>".
"<th>Ubicación</th></tr>";
echo "</thead>";

echo "<tbody class='tipoletra'>";
echo "<tr>";
echo "<td colspan='5' class='dataTables_empty'>Loading data from server</td>";
echo "</tr>";
echo "</tbody>";
echo "</table>";
}
?&gt;
</div>
</div>

&lt;/body&gt;
&lt;/html&gt;

MY CONTROLLER:
function VerTagsMcr()
{
/* $this->load->model('Ethmodel','',TRUE);
$data['consulta'] = $this->Ethmodel->SacaTagsMcr();

$this->load->view('v_view_menu',$data); */
$this->load->model('Ethmodel','',TRUE);
$data['consulta'] = $this->Ethmodel->SacaTagsMcr();
$this->load->view('v_view_menu',$data);
}
public function listener()
{
$table = "tagsmcr";
$columns = array("Obra","id", "IdSubSistema", "TagNo", "Descripcion","Ubicacion");
$index = "id";
$this->load->model("Datatables_model", "datatables");
echo $this->datatables->generate($table, $columns, $index);
}

#8
[eluser]cryogenix[/eluser]
erm could you at least tell us what the error(s) is/are so we could address your problem better?

anyways for starters, have you ever tried datatables in native php without the CI framework? and if yes, did you get it to work? because if you got it to work, all it takes to port it to CI is:

1. setup your listener in a controller (like in my controller example)
2. copy the model i posted above
3. point your sAjaxSource in your datatables script to the address of your listener

keeping those 3 in check, your grid should work.

ps:
you might also want to wrap your posted codes in the "code" bb tag for readability

#9
[eluser]ruizpi[/eluser]
Hi, again!
It's a pleasure to know that somebody can help to one. i will explain a little my problem. I have used this component with the server side example in my database and works well. I test it with your model and my controller and my view but it doesn´t show datas from my table.
My view is like shows:

Code:
&lt;html &gt;
&lt;head&gt;
&lt;title&gt;&lt;?php $titulo_pagina?&gt;&lt;/title&gt;

&lt;link rel="stylesheet" href="../css/misclases.css" type="text/css" /&gt;
&lt;link rel="stylesheet" href="../../../css/demo_table.css" type="text/css" /&gt;
&lt;link rel="stylesheet" href="../../../css/demo_page.css" type="text/css" /&gt;
[removed][removed]
[removed][removed]
[removed]
$(document).ready(function()
        {
          $('#test').dataTable
          ({
            'bProcessing'    : true,
            'bServerSide'    : true,
            'sPaginationType': 'full_numbers',
            'sAjaxSource'    : '&lt;?php echo base_url();?&gt;ethyria/listener',
            'fnServerData': function(sSource, aoData, fnCallback)
            {
              $.ajax
              ({
                'dataType': 'json',
                'type'    : 'POST',
                'url'     : sSource,
                'data'    : aoData,
                'success' : fnCallback
              });
            }
          });
        });
[removed]
&lt;/head&gt;
  &lt;body&gt;
    <div id="Contenedor">
     <div id="BarraIzq">
       <img src='/images/logopine.png' border='0' width='150' height='60' alt='logopine.png (1.095 bytes)'>
       &lt;?php echo br(3);?&gt;
       <table align="center" class="MiTablaMenu">
          <tr>
            <td class="TDMenu"><font class="MiFuenteTituloMenu">MENU</font></td>
          </tr>
          <tr>
          <td class="CeldaTransparente">&lt;?php echo nbs(2);?&gt;</td>
          </tr>
          <tr>
            <td class="TDMenu">
              &lt;?php
                 $Opcion1 = "TAGSMCR";
                 echo anchor('/ethyria/VerTagsMcr',"<button type='submit' class='MiBotonPine'>".$Opcion1."</button>", array('class' => 'SinSubrayadoEnlace'));
              ?&gt;
            </td>
          </tr>
          <tr>
            <td class="TDMenu">
              &lt;?php
                 $Opcion1 = "OPCION 2";
                 echo anchor('/ethyria/VerTagsMcr',$Opcion1,array('class' =>'MiBotonPine'));
              ?&gt;
            </td>
          </tr>
          <tr>
            <td class="TDMenu">
              &lt;?php
                 $Opcion1 = "OPCION 3";
                 echo anchor('/ethyria/VerTagsMcr',$Opcion1,array('class' =>'MiBotonPine'));
              ?&gt;
            </td>
          </tr>

       </table>
     </div>
     <div id="BarraSup">
        <font class="MainFuente">Ethyria Web Access</font>
     </div>
     <div id="MarcoInterior">
          <table id="test" class="display">
          <thead>
            <tr>
              <th>Id</th>
              <th>Tagno</th>
              <th>Descripcion</th>
              <th>Ubicacion</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>loading...</td>
            </tr>
          </tbody>
        </table>

      </div>
    </div>

&lt;/body&gt;
&lt;/html&gt;

My controller is:
Code:
&lt;?php
  class ethyria extends Controller{

      function __construct()
      {
          parent::Controller();
          $this->load->helper(array('html','form','url'));
          $this->load->helper('text');
          // es lo mismo que poner $this->load->helper(Array('html','form','url'));
          $this->load->library('form_validation');
      }

      function index()
      {
          $this->form_validation->set_rules('usuario','Nombre de usuario', 'required');
          $this->form_validation->set_rules('password','Contraseña', 'required|min_length[5]');
           // %s hace referencia al segundo parametro
          $this->form_validation->set_message('required', 'Debe introducir el campo %s');
          $this->form_validation->set_message('min_length', 'Campo %s demasiado corto');
          //    $this->form_validation->set_rules('EdUsuario','Alberto','required');
          //    $this->form_validation->set_rules('EdPassword','44038930','required');

          if ($this->form_validation->run()==FALSE)
          {
              $this->load->view('v_login');
          }
          else
          {
             $this->load->library('table');
             $this->load->model('Ethmodel','',TRUE);
             $usuario = $this->input->post('usuario');
             $password = $this->input->post('password');
             $TieneAcceso = $this->Ethmodel->Tiene_Acceso_Usuario($usuario,$password);
             if ($TieneAcceso==TRUE)
             {
                    $data['titulo_pagina']= 'Ethyria Web Access';
                    $this->load->view('v_view_menu',$data);
             }
             else
                    $this->load->view('v_login');
          }
      }


      function VerTagsMcr()
      {
         $this->load->model('Ethmodel','',TRUE);
         $data['consulta'] = $this->Ethmodel->SacaTagsMcr();
         $this->load->view('v_view_menu',$data);
       }

       public function listener()
       {
         $table = "tagsmcr";
         $columns = array("id","TagNo", "Descripcion", "Ubicacion");
         $index = "id";
         $this->load->model("Datatables_model", "datatables");
         echo $this->datatables->generate($table, $columns, $index);
       }

  }
?&gt;
I have attached a image what i see when i access to "tagsmcr" button.
To be grateful to him for anticipated for his efforts for helping myself

#10
[eluser]cryogenix[/eluser]
ok thank you for making your code more readable. your code seems fine. but it is still not clear to me what errors you are experiencing with it. although my guess is that your grid is not able to communicate with your listener. so anyways, are you familiar with using firebug? firebug can debug ajax responses very well and you can use it to get what your listener is having problems on. so unless you can give me that specific error, im afraid i can't help you.


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


Users browsing this thread:
2 Guest(s)


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2017 MyBB Group.