Results 1 to 5 of 5

Thread: Ext.XTemplate cant handle variable names with slash ("/") in them

    Looks like we can't reproduce the issue or there's a problem in the test case provided.
  1. #1
    Ext JS Premium Member GustavR's Avatar
    Join Date
    Jun 2009
    Posts
    62

    Default Ext.XTemplate cant handle variable names with slash ("/") in them

    REQUIRED INFORMATION

    Ext version tested:

    • Ext 4.1.2.1

    Description:
    • When defining an Ext.XTemplate you cant use a slash inside the curly braces, it wont get replaced by the corresponding value.

    Test Case:
    Code:
    var t = new Ext.XTemplate('{/var}');
    t.apply({'/var': 'test'});
    The result that was expected:
    • "test"

    The result that occurs instead:
    • ""

    HELPFUL INFORMATION

    Possible fix:
    EXTJS4:

    Code:
    Ext.define('Ext.fix.XTemplateCompiler', {
        override: 'Ext.XTemplateCompiler',
        
        //             |< add the slash here :)
        tagRe:  /^([\w-\/\.\#\$]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\/]\s?[\d\.\+\-\*\/\(\)]+)?$/,
        
        parseTag: function (tag) {
            var me = this,
                m = me.tagRe.exec(tag),
                name, format, args, math, v;
    
            if (!m) {
                return null;
            }
    
            name = m[1];
            format = m[2];
            args = m[3];
            math = m[4];
    
            // name = "." - Just use the values object.
            if (name == '.') {
                // filter to not include arrays/objects/nulls
                if (!me.validTypes) {
                    me.definitions.push('var validTypes={string:1,number:1,boolean:1};');
                    me.validTypes = true;
                }
                v = 'validTypes[typeof values] || ts.call(values) === "[object Date]" ? values : ""';
            }
            // name = "#" - Use the xindex
            else if (name == '#') {
                v = 'xindex';
            }
            // name = "$" - Use the xkey
            else if (name == '$') {
                v = 'xkey';
            }
            else if (name.substr(0, 7) == "parent.") {
                v = name;
            }
    //      // compound Javascript property name (e.g., "foo.bar") 
    //      else if (isNaN(name) && name.indexOf('-') == -1 && name.indexOf('.') != -1) { 
    //          v = "values." + name; 
    //      }
            // else: use array notation
            // (http://jsperf.com/string-property-access/4)
            else {    
                v = "values['" + name + "']";
            }
    
            if (math) {
                v = '(' + v + math + ')';
            }
    
            if (format && me.useFormat) {
                args = args ? ',' + args : "";
                if (format.substr(0, 5) != "this.") {
                    format = "fm." + format + '(';
                } else {
                    format += '(';
                }
            } else {
                return v;
            }
    
            return format + v + args + ')';
        }
    });
    EXTJS5:
    Code:
    Ext.define('Perbility.fix.util.XTemplateCompiler', {
        override: 'Ext.util.XTemplateCompiler',
        
        tagRe: /^([\w-\/\.\#\$]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\/]\s?[\d\.\+\-\*\/\(\)]+)?$/
    });
    And please dont ask me why I would want such a thing. It is possible to have JS objects defined that way and our REST-Api uses them everywhere (its returning some kind of a flattened tree with var names like "/root/leaf"). Rewriting all the keys before using them and remapping them back before posting them to the API would make more problems than it would solve.
    Again and finally: A JS object like {'/key': 'value'} is perfectly fine (but uncommon - I know), nevertheless Ext.XTemplate should be able to cope with it.
    Last edited by mitchellsimoens; 18 Dec 2012 at 8:34 AM. Reason: fixed test case syntax error

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,450

    Default

    Thanks for the report! I have opened a bug in our bug tracker.

  3. #3
    Sencha User
    Join Date
    Oct 2009
    Location
    Portland OR
    Posts
    10

    Default

    A good example of when you could run into this is when you are creating dynamic model fields from a server response. Setting a model's fields with something like this will fail:

    Code:
    {"name" : "My \ field name"}
    It fails when data is applied to the Ext.data.reader.Reader's recordDataExtractorTemplate. The field is lost and you end up with an error that looks like this:

    Code:
    TypeError: __field9 is undefined
    Automating model fields and grid columns now requires a bit more logic. I cannot simply create a dynamic column based on a field.

  4. #4
    Ext JS Premium Member GustavR's Avatar
    Join Date
    Jun 2009
    Posts
    62

    Default

    Bug still exists in 5.1.2.748. Is there any update? Still waiting for a fix here.

    For all the folks out there wating too, the needed fix became much smaller since ExtJs5:
    Code:
    Ext.define('Perbility.fix.util.XTemplateCompiler', {
        override: 'Ext.util.XTemplateCompiler',
        
        tagRe: /^([\w-\/\.\#\$]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?(\s?[\+\-\*\/]\s?[\d\.\+\-\*\/\(\)]+)?$/
    });

  5. #5
    Sencha Premium User
    Join Date
    Dec 2015
    Posts
    29

Posting Permissions

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