⚠ In case you've missed it, we have migrated to our new website, with a brand new forum. For more details about the migration you can read our blog post for website migration. This is an archived forum. ⚠

  •     

profile picture

Tooltips on Fields (Add / Edit forms) - Bootstrap Theme



Alejandro

Alejandro
  • profile picture
  • Member

Posted 29 January 2016 - 02:25 AM

Hi,

I'm really new to CI and GC, but I made my first plugin to add tooltips in the fields with Bootstrap theme (it can be extended for use with any of the themes) . For that purpose I have extended the GC library with a library named Tooltip_GCRUD.

You only need to do the following:

1. Add the Tooltip_gcrud.php in the libraries directory

2. Load the library

3. create a crud object with new tooltip_GCRUD (see example) - You must to load first the Grocery Crud library

4. Create a tooltip for a field with: $crud->tooltip('field','tooltip')

5. IMPORTANT!! Load the bootstrap.min.js in the ADD/EDIT php views in order the tooltip have a style

6. You must add one line of code in the add and edit.php views of the theme.

Example:

 

The Examples controller that came with GC I made an examples with customers CRUD:

public function customers_management()
{
$this->load->library('tooltip_gcrud');  //load the library
$crud = new tooltip_GCRUD(); //create object
$crud->set_theme('bootstrap');
$crud->set_table('customers');
$crud->columns('customerName','contactLastName','phone','city','country','salesRepEmployeeNumber','creditLimit');
$crud->display_as('salesRepEmployeeNumber','from Employeer')
->display_as('customerName','Name')
->display_as('contactLastName','Last Name');
$crud->tooltip('customerName','Lorem ipsum dolor ....')->     //create tooltip for one or several fields in the add/edit form
tooltip('phone','Please enter the phone number');
$crud->set_subject('Customer');
$crud->set_relation('salesRepEmployeeNumber','employees','lastName');


$output = $crud->render();


$this->_example_output($output);
}

In the add/edit php views of the bootstrap theme add the following line 

<?php echo $field->tooltip; ?>

After the following line (line 45 aprox. on add.php  and edit.php)

<?php echo $input_fields[$field->field_name]->display_as; ?><?php echo ($input_fields[$field->field_name]->required) ? "<span class='required'>*</span> " : ""; ?>

Thats it!!

 

The result for that attached on a file (tooltip.png), the library is attached (Tooltip_gcrud.php) 

 

Hope it helps!!

 

Any comments are welcome!!