Why am I not getting any values displayed in my ui-grid dropdown?

I have this following code for ui-grid column Definition:

{ name: "carrier_influence_group", displayName: "Carrier influence group", enableCellEdit: true, showSortMenu: false,
                editableCellTemplate: 'ui-grid/dropdownEditor', editDropDownOptionsArray: [ { id: 11, value: 'Medium' }, { id: 12, value: 'Large' }],
                    editDropdownIdLabel: 'id',editDropdownValueLabel: 'name'}

I am binding the name of these object to the column.

Every thing is fine normally. The grid as such renders correctly. But when I dbl click to edit this row, the text in this row disappears. A dropdown appears but it has no option to select from. I tried changing my array to:

[ { id: 11, name: 'Medium' }, { id: 12, name: 'Large' }]

What is missing here. I have seen this official code. Seems like all is similar except for a filter. I do not need any such filter. Is it necessary to have one. The official docs do not mention anything about it.

Already referred http://stackoverflow.com/questions/28323540/showing-readable-data-in-ui-grid-with-editable-drop-down-cell

Solution

First thing to try - it should be editDropdownOptionsArray not editDropDownOptionsArray (note the case).