This all looks ok to me. If the data grid is displaying all 50 rows, you will see all 50 and might not notice that it was actually fetching them 10 rows at a time. To see more about what the server is sending to the client, enable the debug logging in the server. Go to your services-config.xml (in WEB-INF/flex) and search for "level=". Change that to Debug and make sure your <pattern> tags just below that include both "DataService.*" and "Message.*". When you run the application, you should see something like:
[Flex] [DEBUG] Before invoke service: data-service
Notice that there is first a "fill" message which returns 4 rows, then a page message which returns the next 4 rows. Try making your initial window smaller and hit "refresh" and then you should only see those page messages go across when you scroll.