0

我正在使用W2UI 的多选来选择项目。我已经从我的服务器填充了列表，其中包含大约 800 个项目。

$('#enum').w2field('enum', { 
                    items: arrDish, 
                    openOnFocus: true,
                    //onNew: displayValue,
                    onAdd: displayValue,
                    //markSearch:true,
                    onRemove: function (event) {
                        alert("removed");

                    },

                    renderItem: function (item, index, remove) {
                        var html = remove + '<span class="fa-trophy" style="'+ pstyle +'; margin-left: -4px;"></span>' + item.text;
                        //displayValue();
                        return html;


                    },
                    renderDrop: function (item, options) {
                        return '<span class="fa-star" style="'+ pstyle +'"></span>' + item.text;

                    }


                });
                function displayValue() { 
                    console.log($('#enum').data('selected'));
                    selectedDish=getCol($('#enum').data('selected'),'text');
                    console.log(selectedDish); // am getting the values in the console log here but without the latest item
                }
                //below function is also working properly
                function getCol(matrix, col){
                    var column = [];
                    for(var i=0; i<matrix.length; i++){
                        column.push(matrix[i][col]);
                    }
                    return column;
                }

问题是，当我执行该displayValue函数以获取所选项目的最新列表时，最后一项丢失了。

我尝试在onAdd和 onRemove选项上添加一个简单的警报框，我可以看到，这些警报出现在列表中添加项目之前，即当我关闭警报时，从列表中添加/删除项目。

我的要求是，每当所选项目列表发生更改时（以及最新的所选列表），我都想刷新我的图表。

示例案例：

当我在列表中选择 1 项时，控制台会打印“0”项，当我再次选择 2 项时，控制台会打印 1 项，依此类推。

4

1 回答 1

1

您遇到的问题是eventW2UI 的多选的所有功能都是“之前”事件，而不是之后（w2ui 的库在实际事件之前触发事件，而不是之后）。

我搜索了after事件，但找不到任何事件 - 您可以使用该event对象来获取有关将要添加到多选中的当前项目的信息。

function displayValue(e) {
    console.log($('#enum').data('selected'));
    consloe.log(e.item);
}

注意e函数名中的参数displayValue(e)

使用您当前的代码，我刚刚将新项目添加到selectedDish数组中：

function displayValue(e) {
    // The item that we got in this event:
    console.log(e.item);

    // The data we selected before the selection of the new item
    console.log($('#enum').data('selected'));

    // Array of the current selected items
    selectedDish=getCol($('#enum').data('selected'),'text');

    // Add the text of the item we selected
    selectedDish.push(e.item.text)

    // Now the selectedDish contains all the values, including the last one that was selected
    console.log(selectedDish); 
}
于 2016-06-22T22:44:32.493 回答