Results 1 to 5 of 5

Thread: How to replace the XTemplate's charactor

  1. #1

    Default How to replace the XTemplate's charactor

    Hi,

    There is a XTemplate Object and a json Object. Like this:
    Code:
    var data = {
            name: 'Jack Slocum',
            company: 'Ext JS\nLLC',
            sex: 'Boy'
    }
    var tpl = new Ext.XTemplate(
                        '<p>{name}</p>',
                        '<p>{company}</p>',
                        '<p>{sex}</p>'
                    );
    
                    tpl.overwrite(p.body, data);
    Now it only displays like this:
    Jack Slocum
    Ext JSLLC
    Boy

    But I want to replace the "\n" with </br>, and let it display like this:
    Jack Slocum
    Ext JS
    LLC
    Boy

    Yes, it changes lines. So how shall I do?

    Help please!~Thanks first!~

  2. #2
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,892

    Default

    What do you want to know? It creates HTML, and "\n" is just whitespace to HTML. To break a line you need "<br>"

  3. #3
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246

    Default

    You could create your own format function, e.g.

    Code:
    Ext.util.Format.newLine = function(value) {
      return !value ? value : String(value).replace(/\n/g, "<br />");
    };
    and use:

    Code:
    var tpl = new Ext.XTemplate(
      '<p>{name}</p>',
      '<p>{company:newLine}</p>',
      '<p>{sex}</p>'
    );

  4. #4

    Default

    Thanks!~Just it is!~

    I made a mistake, I replace '\n' with '</br>'. And it need be '<br>'.

  5. #5
    Sencha Premium User NoahK17's Avatar
    Join Date
    Apr 2008
    Location
    Atlanta, GA
    Posts
    538

    Default

    Of note, Condor's solution above {variableName:functionName} still works in Ext 6.5.x
    Noah
    Front-End Developer
    Norfolk Southern

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •