How to write php code in hbs?

Question

I have created a custom layout in a sidecar module "Accounts" and display a simple View "Hello World" on the screen. Now what I want to do is that I want to fetch all the accounts records from the database and display in that custom layout. I know that in order to fetch data you have to use either sugarQuery or sqlQuery. And what I want to know is How can I use php code in hbs template? Thanks in advance!

Hijab Fatima · Accepted Answer

You don't use PHP inside the hbs you build your data in javascript with an api call and then use hbs to format your output.

Perhaps the best way to describe it is with an example.

Take the example of a custom dashlet. I have a custom module ContactDetails and when I'm in Contacts or Accounts module I want the dashlet to show the contact details for the Contact or Account I'm on.

I use Javascript to build the "resources" for my dashlet:

({
  tagName: 'ul',
  className: 'dashlet-ContactDetails',
  plugins: ['Dashlet'],
  resources: {},
  refreshClicked: function() {
   this._renderHtml();
  },
  _renderHtml: function(){
    var self = this,
        category_list = app.lang.getAppListStrings('contact_details_category_c_list');
        filter = '';
    self.resources = new Object();
    //build the data
    var id = self.model.get('id'),
        module = self.module;
    if(module == 'Contacts'){
      filter_params = [{'contact_id_c':id}];
    }else if(module == 'Accounts'){
      filter_params = [{'account_id_c':id}];
    }
    var contactDetails = app.data.createBeanCollection('conde_Contact_Details');
    var fetchedDetails = contactDetails.fetch({
      filter: filter_params,
    });
    fetchedDetails.xhr.done(function(data){
        _.each(data.records, function(rec){
            var
                link= '',
                teaser = '',
                url = 'index.php?model=Home&action-index#conde_Contact_Details/'+rec.id,
                link = rec.name,
                icon = 'fa-link'
                color = 'green',
                teaser = category_list[rec.categorization];
            self.resources[rec.id]={
               'color':color,
               'icon':icon,
               'link':link,
               'teaser':teaser,
               'url':url,
            };
            self._super('_renderHtml');
        });
    });
  },
})

In this example I create a collection (using app.data.createBeanCollection) from the 'conde_Contact_Details' module and filter it by the contact id or account id (both exist in the module in question).

With that collection, I build the self.resources with the data from each of the records.

Now in the hbs I can loop through each of the resources and build the output:

{{!--
 */ formats output for Contact Details  dashlet
--}}
{{#each resources}}
  <li class="resource {{css_class}}">
    <a href="{{url}}" target="_blank"><span class="label label-module label-module-md pull-left {{color}}"><i class="icon-2x {{icon}}"></i></span></a>
    <div class="resource-info">
        <a href="{{url}}" target="_blank">{{str link module}}</a>
        <p class="details">{{str teaser module}}</p>
    </div>
  </li>
{{else}}
      <div class="block-footer">{{str "LBL_NO_DATA_AVAILABLE"}}</div>
{{/each}}

notice the #each which loops through one resource at a time, inside the #each I can refrence the color, icon, link, teaser, and url for that particular resource.

There are probably better ways of doing this, but it should give you a picture of how to begin.

Look for a view that resembles what you are trying to achieve in Sugar, check the code and see how they built it. That usually helps me find solutions. The code I shared above, for example, was based off of the learning resources dashlet:

clients/base/views/learning-resources/

Hope this helps,
FrancescaS

{{/each}} notice the #each which loops through one resource at a time, inside the #each I can refrence the color, icon, link, teaser, and url for that particular resource. There are probably better ways of doing this, but it should give you a picture of how to begin. Look for a view that resembles what you are trying to achieve in Sugar, check the code and see how they built it. That usually helps me find solutions. The code I shared above, for example, was based off of the learning resources dashlet: clients/base/views/learning-resources/ Hope this helps, FrancescaS