1. #1
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    10
    Vote Rating
    0
    vukbyte is on a distinguished road

      0  

    Default DomQuery "style" attribute select not working in IE7

    DomQuery "style" attribute select not working in IE7


    I have a reference to the root element of a dom with all different sub-elements. For example:
    <div id="root_node">
    <div style="text-align: left;">Some text aligned left<br></div>
    <div style="text-align: right;">Some Text aligned right<br></div>
    <div style="text-align: center;">Some test aligned center</div>
    </div>


    I am trying to find all sub elements that have text-align explicitly specified in the style attribute. For example the following selector returns 3 element as a result in all browsers except for IE7.

    var result = root_node.select("*[style*='text-align'], *[style*='TEXT-ALIGN']");


    In IE7 I get an Exception in Ext. Object doesn't support this property or method
    Located in DomQuery.js

    operators : {
    "=" : function(a, v){
    return a == v;
    },
    ...
    "*=" : function(a, v){
    return a && a.indexOf(v) !== -1;
    },

    The problem seems to only happen when looking in the "style" attribute. I am able to search in other attributes. Is any one else experiencing this problem?

    I am using ExtJs 3.2.1

  2. #2
    Sencha User laurentParis's Avatar
    Join Date
    Aug 2010
    Location
    paris
    Posts
    246
    Vote Rating
    2
    laurentParis is on a distinguished road

      0  

    Default


    use always uppercase to designate attributs
    PHP Code:
    var result root_node.select("*[STYLE*='text-align'], *[STYLE*='TEXT-ALIGN']"); 

  3. #3
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    10
    Vote Rating
    0
    vukbyte is on a distinguished road

      0  

    Default Resolved the issue

    Resolved the issue


    I was able to fix this issue by adding some code to the byAttribute function in DomQuery. See the commented Fixup code below.


    PHP Code:
        // operators are =, !=, ^=, $=, *=, %=, |= and ~=
        // custom can be "{"
        
    function byAttribute(csattrvalueopcustom){
            var 
    result = [], 
                
    ri = -1
                
    useGetStyle custom == "{",        
                
    fn Ext.DomQuery.operators[op],        
                
    a,        
                
    innerHTML;
            for(var 
    0cici cs[i]; i++){
            
    // skip non-element nodes.
                
    if(ci.nodeType != 1){
                    continue;
                }
            
                
    innerHTML ci.innerHTML;
                
    // we only need to change the property names if we're dealing with html nodes, not XML
                
    if(innerHTML !== null && innerHTML !== undefined){
                    if(
    useGetStyle){
                        
    Ext.DomQuery.getStyle(ciattr);
                    } else if (
    attr == "class" || attr == "className"){
                        
    ci.className;
                    } else if (
    attr == "for"){
                        
    ci.htmlFor;
                    } else if (
    attr == "href"){
                        
    ci.getAttribute("href"2);
                    } else if (
    Ext.isIE7 && attr == "style"){
                        
    // Fixup::: getAttribute returns a style object.  The cssText property 
                        // contains the contents of the style attribute.  Ex: 'color: red; top 5px;'
                        
    ci.getAttribute("style").cssText;
                    } else{
                        
    ci.getAttribute(attr);
                    }
                }else{
                    
    ci.getAttribute(attr);
                }
                if((
    fn && fn(avalue)) || (!fn && a)){
                    
    result[++ri] = ci;
                }
            }
            return 
    result;
        } 
    This fix may do without the Ext.isIE7, but I added that check to limit any regression in existing code. My guess is this is an Ext bug.

Similar Threads

  1. "." Character in DomQuery.select XPATH - escape character?
    By keith204 in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 18 Jun 2010, 11:52 AM
  2. "cls" attribute not working
    By napolux in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 6 May 2009, 6:26 AM
  3. Checkbox selection model "select/deselect all" header not working
    By scoomey in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 24 Feb 2009, 10:55 PM
  4. does "BasicForm" have any attribute like html Form "target" attribute
    By michoeal in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 25 Dec 2007, 3:05 AM
  5. DomQuery - Select all links except rel="external"
    By tony.summerville in forum Ext 1.x: Help & Discussion
    Replies: 2
    Last Post: 4 May 2007, 9:49 AM

Thread Participants: 1

Tags for this Thread