REQUIRED INFORMATION

Sencha Touch version tested:
  • Sencha Touch 2.1
Browser versions tested against:
  • Chrome Version 23.0.1271.64

Touch devices tested against:
  • Samsung galaxy S2
  • iPad 1
Description:
  • When using NestedList and rendering contents for each item using getItemTextTpl(), the height of each item is not adjusted correctly if the text for the item is multiline
Steps to reproduce the problem:
  • In docs for 2.1, API doc for NestedList, change the code for the example using "Code editor". Add this to the definition of var nestedList:
    Code:
    getItemTextTpl: function(nodeItem) {return 'Line 1<br/>Line 2';}
  • Switch back to "Live preview"
The result that was expected:
  • A list with two lines for each item, with height for each item correctly adjusted
The result that occurs instead:
  • A list with the separators and items misaligned
If you go to the 2.0 docs and try the same thing on the same example, everything looks as expected.


HELPFUL INFORMATION
I have not looked very closely into the reason for this change in behaviour, but I can see that the rendering of the list items have changed significantly from 2.0 to 2.1. Amongst other, the position for each .x-list-item now is absolute, which leads me to think that there is some kind of computation of the top positon of each item.

Possible fix:
  • not provided
Additional CSS used:
  • none
Operating System:
  • Ubuntu 12.04