list view item


#1

Hi,

I am using onitemrender event in order to hide or show content of the element…

How can i access to data fields of an xml…because if some field is empty i want to hide the div where that content is shown…

i tryed using #field_name# but does not work… what is the correct way?

thanks and greetings!!


#2

Hi,

You can use templates. Templates can be defined as a function where you can set any rules you want:

some_template: function(obj){ if(obj.type == "a") return obj.fieldA return obj.fieldB }

In order to redraw a certain item in a list you should call refresh() method with the id of this item. So, for example if you want to apply new template for an item (with type “a”), you can do the following:

someList.item(“someId”).type = “a”;
someList.refresh(“someId”);


#3

Thanks!! this is what i want…

greetings!!


#4

hi,

i have one question about list elements…

how can i change an image src that is contained in an element list… i mean, suppose i have a template for list elements…and inside that template i have some images that i want to change its src when click on one for example…

I have to get that img from that element list…from its template…

i have this js function that is called when clicking on an image

function changeImg(id) {

var _list = = $$("list");

_list.data.each(function (item) {

    if (id = item.id) { // element found
             _list.define("template", "whatever");
             _list.refresh(id);
    }

}
but that changes every element template…and i want to change just one…

so i guess the define method call does this…so i need something to change just one…

thanks and greetings…


#5

Hi,

you can use the same approach as in my previous post.
if for example the template is:

template: "<img src='#img#'/>"

You can apply the following to update image of a certain item:

// set new 'img' property list.item(someId).img = "some.png"; // redraw an item list.refresh(someId);


#6

Hi,

but i want to redraw some html of my list item…without using data properties.

it is just html.

Am i wrong?

greetings!


#7

Hi,

item html should be set via template. There is not necessity to change item data, but you should set a template that will generate items you need. For example:

var src = "": ... template: function(obj){ var img= (src?src:"default.png"); src = ""; return "<img src='"+img+"'/>" } ... src = "some.png"; list.refresh(someId);


#8

I am sorry but i am missing something…

this is my case:

this is a function that paints some html in my list element…

//original html
function getBarraGris(lista,obj)
{
return “

” +
” +
” +
” +
” +
” +
”;
}

//new html list item (RED)
function getBarraGrisRoja(lista,obj) {
return “

” +
” +
” +
” +
” +
”;
}

//new html list item (YELLOW)
function getBarraGrisAmbar(lista,obj) {
return “

” +
” +
” +
” +
” +
”;
}

//new html list item (GREEN)
function getBarraGrisVerde(lista,obj) {
return “

” +
” +
” +
” +
” +
”;
}

as you can see there is some imgs (megusta1, megusta2 and megusta3)…and this imgs have an event onclick

then, this is the function i have attached to that event… and it is used for other lists…that have the same template list item…

function megusta(lista,id,selectedLikeValue) {

var _lista = $$("publicos");

//buscamos elemento clickado
_lista.data.each(function (item) {
    if (id == item.id) { //Elemento encontrado
        switch (parseInt(selectedLikeValue)) {
            case 1: //rojo
                {
                   
                      var _rojo = getBarraGrisRoja(lista, item) 

                    _lista.refresh(item.id);
                    //_lista.define("type", { template: function () { return alert(1); } });
                    break;
                }
            case 2: //amarillo
                {
                    var _ambar = getBarraGrisAmbar(lista, item)

                    _lista.define("template", _ambar);
                    break;

                }
            case 3: //verde
                {
                    var _verde = getBarraGrisVerde(lista, item) 
                   
                    _lista.define("template", _verde);
                    break;
                }
        }
         _lista.refresh(id);
    }
})

}

As you can see i find the element that i wanna change and i have to change its html and refresh the element, but i think all this is not necesary…

So…can you explain to me how i must do it, please…

thanks and greetings!


#9

hi again,

_lista.define(“type”, { template: function () { return _newHTML } });
_lista.refresh();

or

_lista.define(“template”, _rojo);
_lista.refresh();

this code changes all the list templates…but i want just the clicked one…


#10

i tried _lista.refresh(id); but does nothing…however as i said before, _lista.refresh(); changes all items template…

hope it helps…

greetings!


#11

Well… it worked…so the tickect is closed()

i used

_lista.refresh(item.id);

thanks alexandra…