HelloWorld - part 5 header properties

From EPESI framework documentation
Jump to: navigation, search


EPESI's Record Browser CRUD engine has 3 modes for viewing:

- Browse view - shows records in the recordset arranged as a table but only with fields which have a property set_visible();

- View mode - shows all fields of the record as defined in the recordset

- Edit mode - the same form as in View mode but with editing enabled


Sometimes it is necessary to change the way records are viewed in browse view. To do so you must use the set_header_properties method to override defaults. The most common properties you can set in your header are:

- field's width

- field's alias for the fields name


$this->rb->set_header_properties(array('<field_name>'=>array('name'=>__('<short>')),'trainingid'=>array('width'=>'<width>')));

where <field_name> is the fields name and <short> is the shortcut for the fields name and<width> is the fields width i.e.:

'field'=>array('width'=>'80px')));

I.e. if you want the Text field to be shortened to T in browse view the code should look like this and width to 60 px.

$this->rb->set_header_properties(array('text'=>array('name'=>__('T'),'width'=>"60px")));

The body function so far.

 public function body() {
       $rs = new Custom_HelloWorld_Recordset();
       $this->rb = $rs->create_rb_module($this);
       $me = CRM_ContactsCommon::get_my_record();
       $this->rb->set_defaults(array('longtext'=>"some text","select"=>$me['id']));
       $this->rb->set_header_properties(array('text'=>array('name'=>__('T'),'width'=>"30px")));
       $this->display_module($this->rb);
 }

Now when you open your module in browse view the field's name will be T. and the width will stay 35px wide as shown below.

before : Header1.png

after: Header2.png

In edit or view mode the field will have it's full name.

You can also set a custom pop up for your header field to inform the user about the fields purpose or so i.e.

$tooltip = Utils_TooltipCommon::open_tag_attrs('<img src="'.Base_ThemeCommon::get_template_file('Custom_HelloWorld', 'Text_type_chart.png').'"/>', false, 400);
        $stool_type_label = '<span '.$tooltip.'><img style="vertical-align: middle;" border="0" width="50" height="50"
 src="'.Base_ThemeCommon::get_template_file('Custom_HelloWorld', 'info.png').'"> '.__('Type').'</span>';

        $this->rb->set_header_properties(array(
            'text'=>array('name'=>__('T'),'width'=>'30px'),
            'longtext'=>array('name'=>$stool_type_label)


         ));

For this to work you must of course install your theme with a Text_type_chart.png and info.png images as of this example (just add any image to the theme folder). After you have done so you will see a pop up when hovered over the field in browse view.


Download: Get full tutorial here


NEXT >