钛合金:我想从一个窗口添加和删除行,它将在第二个窗口中自动更新

时间:2017-08-02 02:19:26

标签: titanium titanium-alloy appcelerator-alloy appcelerator-studio

我有两个xml文件.. index.xmlwin2.xml,两个窗口的tableview在我想说的行中都有相同的内容:

index.xml

<Alloy>
<Window backgroundColor="red" >
    <ScrollView id="scrollview"  >
        <TableView id="table" >
        <TableViewRow title="Capsicum" onClick="select"></TableViewRow>
        <TableViewRow title="Beans" onClick="select" ></TableViewRow>
        <TableViewRow title="Spinach" onClick="select"></TableViewRow>
        <TableViewRow title="Pizza" onClick="select"></TableViewRow>
        <TableViewRow title="Burger" onClick="select"></TableViewRow>
    </TableView>
    </View>
    </ScrollView>
    </Window>

index.js

function select(e) {
    if (e.row.hasCheck) {
        e.row.hasCheck = false;
    } else {
        e.row.hasCheck= true;
    }

}
$.index.open();

win2.xml

<Alloy>
    <Window backgroundColor="red"  id="win2">
        <TableView id="tableView" >
            <TableViewRow title="Capsicum" onClick="select"></TableViewRow>
            <TableViewRow title="Beans" onClick="select" ></TableViewRow>
            <TableViewRow title="Spinach" onClick="select"></TableViewRow>
            <TableViewRow title="Pizza" onClick="select"></TableViewRow>
            <TableViewRow title="Burger" onClick="select"></TableViewRow>
        </TableView>
        <TextField id="textfield"  returnKeyType="Ti.UI.RETURNKEY_DONE" onReturn="addRow" class="insertField" hintText="Add ingredients"></TextField>
        <Button id="removeButton" onClick="removeRow"></Button>
    </Window>
</Alloy>

win2.js

 function select(e) {
    if (e.row.hasCheck) {
        e.row.hasCheck = false;
    } else {
        e.row.hasCheck= true;
    }
}

    function addRow(){
   var myTextFieldValue = $.textfield.value.trim();
   if (myTextFieldValue != "") {
      $.tableView.appendRow( Ti.UI.createTableViewRow({title:myTextFieldValue}) );
   }
}

function removeRow() {
    // first get all sections of table which will be first section in your case
    var sections = $.tableView.sections;

    // perform this check to make your code error free when there are no rows added to tableview.
    if (sections.length !== 0) {
        var rows = sections[0].rows;
        var totalRows = rows.length;

        if (totalRows !== 0) {
            // now delete all rows which has uncheck=true
            for (var i=0; i<totalRows; i++) {
                var tempCurrentRow = rows[i];
                if (tempCurrentRow.hasCheck) {
                    $.tableView.deleteRow(tempCurrentRow);
                }
            }
        }
    }
}

现在,如果我添加或删除win2.xml或第二个窗口中的任何元素,它也会删除或添加index.xml或第一个窗口......

注意: 我只想从第二个窗口删除已检查的元素,即hasCheck=true,当我添加一些新元素时,我将能够像旧元素一样检查它们Like This

我们可以在两个窗口中创建单个tableview和访问吗?

1 个答案:

答案 0 :(得分:0)

@Rene Pot一样,你可以使用数据绑定,或者如果它太多,你可以通过文件或属性共享数据。

您需要从数据中创建一个JSON对象,并解析此数据以创建表。更改表中的数据后,将对JSON对象应用所有更改。当您打开窗口时,可以使用该数据创建表格。

初始数据:

var myData = [{"name":"Item name 1", "checked": true,..}, {"name":"Item name 2", "checked": false,..}, ...]; 
Ti.App.Properties.setObject("myData", myData);

现在在你的另外两个控制器中:

var myData = Ti.App.Properties.getObject("myData", []); // this will receiv myData or {}

现在myData包含所有元素,你可以用这个数组创建表。

当您更改要检查的第0行时,您需要更改myData[0].checked=true/false;。最后,再次执行Ti.App.Properties.setObject("myData", myData)来存储数据。

如果您有大量数据或想要保留它,即使用户清除了应用缓存/存储空间,您也可以将myData保存到文件中并再次阅读,而不是getObject

未来: 使用数据绑定/模型将帮助您摆脱所有这些手动更新。当您更改数据时,所有连接的元素都将更新