Results 1 to 7 of 7

Thread: how can I update a renderer icon inside a grid ??

  1. #1
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    95
    Answers
    2

    Default how can I update a renderer icon inside a grid ??

    Hello, I'm having some difficulties trying to update a column value inside a grid, when its rendered it loads an icon into the grid:
    Code:
    this.columns = [
                {header: 'Estado', dataIndex:'icon', renderer:this.renderIcon, width:45},
                {header: 'Descripcion', dataIndex:'descripcion',flex:1},
                {header: 'id', dataIndex:'id', hidden:true}
            ];
    The renderer function calls this.renderIcon:
    Code:
    renderIcon:function(val){
            return '<div class="' + val + '" width="24px" height="24px"></div>';
        }
    This part works correctly, but I have a task manager updating this image, so, I tried this:
    Code:
    vstore.each(function(rec){
    				var record = tstore.getById(rec.data.id);
    				if(record!==undefined){
    					record.set({
    						icon:rec.data.icon
    					});
    					if(record.data.googlelat!==rec.data.googlelat || record.data.googlelong!==rec.data.googlelong){
    						record.data.googlelat = rec.data.googlelat;
    						record.data.googlelong = rec.data.googlelong*-1;
    					}
    				}
                    Ext.each(markers,function(mrk){
    					if(mrk.id == 'marker-'+rec.data.imei){
    						point = new google.maps.LatLng(rec.data.googlelat, rec.data.googlelong*-1);
    						mrk.setPosition(point);
    						mrk.setIcon(rec.data.icon);
    					}
    				});
                });
    So, record.set doesn't do what I want, which is, to render a new icon inside the column grid; All i get with the set function is to change the icon to the text:'/images/status-busy.png' How can I achieve this ??
    Thank you.
    Last edited by luisparada; 10 Aug 2012 at 5:34 PM. Reason: Missed tag end: '</div>'
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

  2. #2
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    It seems that you are missing the closed DIV tag. Try to fix the renderIcon() to see if it will fix the problem:
    Code:
    renderIcon:function(val){
        return '<div class="' + val + '" width="24px" height="24px"></div>';
    }

  3. #3
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    95
    Answers
    2

    Default

    That was a Typo, sorry, What I'm trying to say is that when it first loads it renders correctly because I'm passing the function renderer in the columns definition, what I'm try to do is to get the record and update the icon with an ajax result from a different store, so right now when I try record.set it doesn't render an html element, it just removes the icon and replace it with the string '<div class="' + val + '" width="24px" height="24px"></div>'
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

  4. #4
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    95
    Answers
    2

    Default

    Can anybody give me a tip or a hand on this ?? thanks...
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

  5. #5
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    95
    Answers
    2

    Default

    Can anybody help me on this please ?? its urgent...
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

  6. #6
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    Hi luisparada,

    I don't see any problem with the code you supplied. So let try to isolate the problem:
    - What will happen if you call tstore.getAt(0).setIcon('iconClass').
    - With "Inspect Element" tool, try to see what is the HTML markup of the rendered data
    - What will happen if you mark comment all other command line except record.set({icon:rec.data.icon});
    It will be better if you can post a complete test case that reflect your case.

  7. #7
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    250
    Answers
    44

Tags for this Thread

Posting Permissions

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