locked
How to set key property for a binding list?

    Question

  • The documentation for WinJS.Binding.List  states that it can be accessed by a string key.  It has the getItemFromKey method listed.  How do I set the key property for the list.

    I have an array of objects and like to set one property as key.

    eg:

    var array = [{userid: "abcd", value: 100}, ... ];

    var list = new WinJS.Binding.List(array);

    How to specify userid property as the key for list so that I could use list.getItemFromKey("abcd")

    Thursday, March 20, 2014 6:09 AM

Answers

  • To use getItemFromKey with a non-index value, you might look here:

    http://stackoverflow.com/questions/15169135/winjs-binding-list-key-value-isnt-found

    I can use the above code to get an item reference by adding a new implementation of resolveItemReference() to check for my userid, which effectively becomes the key.

        // Same code as above.

        var array = [{ userid: "abcd", value: 100 }, {userid: "defg", value: 200}];

        var list = new WinJS.Binding.List();

        array.forEach(function (item) {
            list.push({
                group: "group 1", key: item.userid,
                value: item.value
            });
        });

        // Also requires some template code, like this. See data.js in the templates.

        var groupedItems = list.createGrouped(
            function groupKeySelector(item) { return item.group.key; },
            function groupDataSelector(item) { return item.group; }
        );

        // New code

        var item = resolveKeyReference("abcd"); 

        // New implementation of resolveItemReference, from template code.
        function resolveKeyReference(itemKey) {
            for (var i = 0; i < groupedItems.length; i++) {
                var item = groupedItems.getAt(i);
                if (item.key === itemKey) {
                    return item;
                }
            }
        }



    Friday, March 28, 2014 4:42 PM

All replies

  • When you create a list that way, the key that you get associated with the list is in the integer, not a string. If you look at the implementation of base.js, you will notice how the list gets created.

    Windows Store Developer Solutions, follow us on Twitter: @WSDevSol|| Want more solutions? See our blog

    Thursday, March 20, 2014 11:59 PM
    Moderator
  • Is there a way to create a list to set userid property as key? 

    Looks like the array index is just converted to string and stored as key.

    Friday, March 21, 2014 2:44 AM
  • I think this is what you want:

        var array = [{ userid: "abcd", value: 100 }, {userid: "defg", value: 200}];

        var list = new WinJS.Binding.List();

        array.forEach(function (item) {
            list.push({
                group: "group 1", key: item.userid,
                value: item.value
            });
        });

    Wednesday, March 26, 2014 4:24 PM
  • Sorry that doesn't work,

    I couldn't use list.getItemFromKey("abcd")

    It the list still uses index as the key.

    Thursday, March 27, 2014 1:27 AM
  • To use getItemFromKey with a non-index value, you might look here:

    http://stackoverflow.com/questions/15169135/winjs-binding-list-key-value-isnt-found

    I can use the above code to get an item reference by adding a new implementation of resolveItemReference() to check for my userid, which effectively becomes the key.

        // Same code as above.

        var array = [{ userid: "abcd", value: 100 }, {userid: "defg", value: 200}];

        var list = new WinJS.Binding.List();

        array.forEach(function (item) {
            list.push({
                group: "group 1", key: item.userid,
                value: item.value
            });
        });

        // Also requires some template code, like this. See data.js in the templates.

        var groupedItems = list.createGrouped(
            function groupKeySelector(item) { return item.group.key; },
            function groupDataSelector(item) { return item.group; }
        );

        // New code

        var item = resolveKeyReference("abcd"); 

        // New implementation of resolveItemReference, from template code.
        function resolveKeyReference(itemKey) {
            for (var i = 0; i < groupedItems.length; i++) {
                var item = groupedItems.getAt(i);
                if (item.key === itemKey) {
                    return item;
                }
            }
        }



    Friday, March 28, 2014 4:42 PM