angularjs - Scrolling problems with kendo-ui Autocomplete in embedded mode (without iframes) -

i'm altering website devided iframes being embedded (with angularjs), without iframes.

there big problem this: had kendo ui auto-complete drop-down element selecting locations. behavior iframe , embedded totally different concerning scrolling in area around/beneath auto-complete drop-down.

old app: site (iframe) around scrolled , drop-down still visible , moved rest of site until selected item. new app: drop-down box closes , have retype input open again. unacceptable usability!

how auto-complete drop-down (doesn't have kendo if not possible) have old scrolling behavior in embedded mode?

well, found workaround works fine me:

in directive html, added callback event k-close. in callback in controller prevented default behavior of close event (of course under specific conditions) following code in controller:

$scope.closecallback= function (e) {      if (someconditionforwhichdropdownshouldntbeclosed) {           e.preventdefault();      } }; 

and here's html of directive:

<input     ng-model="model"             kendo-auto-complete="source"     k-data-source="locationdatasource"     k-select="selectlocation"     k-close="closecallback"> 

in case, prevented dropdown being closed long no item selected.

for added new boolean scope variable false default, set true if dropdown opened:

$scope.locationdatasource = new kendo.data.datasource({     type: "json",     serverfiltering: true,     transport: {         read: function (options) {              $scope.keepkendodropdownopen = true;              someotherfuncionalityafterselectinganitem();         }      } }); 

and set false again after selecting (in callback of directive's k-select).

would nice watch if user presses esc or something, until it's okay enough.

please feel free make solution better or post other solutions! :-)