How to include basic "indent characters" in Sugar description and see the text correctly indented on record view (without having to edit it) ?

Hello,

I have a small issue and there is probably a trick but I don't get it.

I want to fill a basic description field (textarea) with some text, including indentation character (\t or mulitples spaces) to display the text in a proper way.

Unfortunatelly, the formating characters are removed from the view (but are still there because the text is correctly indented when I edit it).

any Idea?

Parents
  • Hi Frédéric,

    When Sugar renders the detail view template, I believe they only convert new lines (\n) to breaks (<br>) for display. In order to get it to respect tabs and multiple spaces, you'd likely have to customize the textarea field to convert them to html characters.

  • Hi ,

    that was what I was hoping to avoid :-(.

    But this also confirm that I am not totally dumb so it is only half a bad news.

    Thanks for your feedback.

    Fred

  • Hi Frédéric,

    I might have some good news! I spent some time doing a quick proof of concept and have some steps and an example download for you.


    Here's the general idea of what a developer would need to do:

    To accomplish our desired formatting, we will first need to create a custom helper function for the handlebar templates.

    ./custom/JavaScript/CustomHandlebarHelpers.js

    /**
     * Custom Handlebar helpers.
     *
     * These functions are used in handlebars templates.
     * @class Handlebars.helpers
     * @singleton
     */
     (function(app) {
        app.events.on("app:init", function() {
            /**
             * convert text to HTML for formatting
             */
            Handlebars.registerHelper("customTextToHTML", function (text)
            {
                text = Handlebars.Utils.escapeExpression(text);
                text = text.replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + '<br>');
                text = text.replace(/(\t)/g, '&nbsp;&nbsp;&nbsp;&nbsp;');
                text = text.replace(/(\x20)/g, '&nbsp;');
                return new Handlebars.SafeString(text);
            });
        });
    })(SUGAR.App);
    

    Next, we need to create a JSGrouping to register our new function.

    ./custom/Extension/application/Ext/JSGroupings/CustomHandlebarHelpers.php

    <?php
    
    foreach ($js_groupings as $key => $groupings) {
        $target = current(array_values($groupings));
        if ($target == 'include/javascript/sugar_grp7.min.js') {
            $js_groupings[$key]['custom/JavaScript/CustomHandlebarHelpers.js'] = 'include/javascript/sugar_grp7.min.js';
            break;
        }
    }
    

    Finally, we need to copy ./clients/base/fields/textarea/detail.hbs to custom/clients/base/fields/textarea/detail.hbs and replace all instances of {{nl2br}} with {{customTextToHTML}}

    ./custom/clients/base/fields/textarea/detail.hbs

    <div> 
        {{#if value.short}} 
            {{#if collapsed}} 
                {{customTextToHTML value.short}}&hellip; 
            {{else}} 
                {{customTextToHTML value.long}} 
            {{/if}} 
            <button data-action="toggle" class="btn btn-link btn-invisible toggle-text"> 
                {{#if collapsed}} 
                    {{str 'LBL_TEXTAREA_MORE' module}} 
                {{else}} 
                    {{str 'LBL_TEXTAREA_LESS' module}} 
                {{/if}} 
            </button> 
        {{else}} 
            {{customTextToHTML value.long}} 
        {{/if}} 
    </div>
    

    Navigate to Admin > Repairs > Quick Repair and Rebuild and you should be good to go!


    You can download the module loadable package from here:
    upsertconsulting.com/.../




  • Hi

    thank you for this quick and great feedback. I will try as soon as possible.

    Have a good day

    Fred

Reply Children
No Data