Question

I have created a multi-select list, input text box and a add button. User can insert the new option in the multiselect list through input box and add button. I have created an example fiddle also :

http://jsbin.com/exuwis/7/edit

I have used knockout.js in my example.The select list is defined with "size="5". After I get more than 5 entries in the list, I can’t see any new entries without manually scrolling to the bottom. I want that when user enter any new entry in the list the scroll bar automatically moves to the bottom of the list. How can i do this ?

Answer 1

Consider adding the new option on top of the other options.

Not a good practice to auto scroll content.

Use

self.CourseOptions.unshift(self.OptionToAdd());

instead of

self.CourseOptions.push(self.OptionToAdd());

to insert item at the begging of the array.