Nilesh Verma
Nilesh Verma

Reputation: 924

update text inside list view on itemclick titanium appcelerator

Titanium Appcelerator unable to update text inside listview code on button click below:

{
            type : 'Ti.UI.View',
            bindId : 'vwqtySelection',
            properties : {
                top : '30dp',
                height : '50dp',
                //backgroundColor: 'red',
                width : require('main').XhdpiSupport(150),
                right : '90dp',
                zIndex : 10

            },
            childTemplates : [{
                type : 'Ti.UI.Button',
                bindId : 'btnMinus',
                properties : {
                    left : '15dp',
                    color : '#676972',
                    title : '-',
                    width : require('main').XhdpiSupport(30),
                    height : require('main').XhdpiSupport(22),
                }

            }, {
                type : 'Ti.UI.Label',
                bindId : 'qtyValue',
                properties : {
                    //touchenabled : false,
                    left : '50dp',
                    color : '#676972',
                    text : '4',
                    textAlign : 'center',
                }

            }, {
                type : 'Ti.UI.Button',
                bindId : 'btnPlus',
                properties : {
                    left : '79dp',
                    color : '#676972',
                    title : '+',
                }
            }]  
        }

> Itemclick selection where to update text on button click wants to update text on button click i.e. 4 to 2

below code i tried

    scrlView.addEventListener('itemclick', function(e) {

         if (e.bindId === 'btnMinus') {
             item = section.getItemAt(e.itemIndex);
                e.section.qtyValue.properties.text = "2";
                e.section.updateItemAt(e.itemIndex, item); 
               //here not able to  update text 4 to 2 
        } else if (e.bindId === 'btnPlus') {

        }
}};

error getting below Message: Uncaught TypeError: Cannot read property 'properties' of undefined

Upvotes: 1

Views: 3213

Answers (1)

Zabady
Zabady

Reputation: 301

This is an example of how to edit a UI element in a listView. Each ListItem contains a Label that includes a number and a plus label, when you click on the plus label, it should increment the number in that listItem.

index.xml file:

<ListView id="listView" class="listView" defaultItemTemplate="template">
    <Templates>
        <ItemTemplate name="template" layout='horizontal'>
            <Label bindId="number" id="number" left=20>0</Label>
            <Label bindId="add" id="add" right=20 onClick="addOneToCurrentNumber">+</Label>
        </ItemTemplate>
    </Templates>

    <ListSection>
        <ListItem number:text='0' />
        <ListItem number:text='-50' />
        <ListItem number:text='100' />
        <ListItem number:text='1024' />
    </ListSection>
</ListView>

index.js file:

function addOneToCurrentNumber(e) {
    var row = $.listView.sections[0].getItemAt(e.itemIndex);
    var number = parseInt(row.number.text);
    number++;
    row.number.text = number;
    $.listView.sections[0].updateItemAt(e.itemIndex, row, { animated:true });
}

Hope this helps, please let me know if you needed any modifications.

Upvotes: 1

Related Questions