jquery Autocomplete macht mCustomScrollbar scrollen nach oben auf Auswahl

Question

Ich habe das mCustomScrollbar-Plugin in meinen Backoffice-Schnittstellen implementiert. Es funktioniert gut. Aber in einem meiner Formulare habe ich ein Stadtfeld, das die automatische Vervollständigung benötigt.

Die Autocomplete funktioniert auch gut. Aber wenn ich eines der Elemente aus den Autocomplete-Quelldaten auswähle, bringt mich das mCustomScrollbar-Plugin automatisch an den Anfang des Bildlauf-Inhalts und ich muss ein zweites Mal klicken, damit das Element tatsächlich ausgewählt wird.

Dies ist, wie ich die Scrollbar Plugin implementiert:

$('#mainContent').mCustomScrollbar({ 
     set_height: height, 
     scrollInertia: 500, 
     scrollEasing: "easeInOutQuad", 
     mouseWheel: 20, 
     autoDraggerLength: true, 
     advanced: { 
      updateOnBrowserResize: true, 
      updateOnContentResize: false 
     } 
    }); 

Und das ist, wie ich die zur automatischen Vervollständigung umgesetzt:

el.autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: activityAutocomplete, 
      dataType: "json", 
      data: request, 
      success: function (data) { 
       if (data.length == 0) { 
        data.push({ 
         label: "Pas de résultat" 
        }); 
       } 
       response(data); 
      } 
     }); 
    }, 
    //If overflow edge of window, the autocomplete flips to top of input 
    position: { collision: "flip" }, 
    autofocus: true, 
    delay: 150, 
    minLength: 1, 
    select: function (event, ui) { 
     //ui.hide(); 
     //The following code resizes the input by bluring it. 
     setTimeout(function() { el.autoGrowInput(); }, 50); 


    }, 
    appendTo: '#autocomplete-tb-city-' + el.parents('.item').attr('id') 
}); 

Ich hoffe, dass Sie falsch hier etwas finden, ich habe 3 Tage lang daran arbeiten!

EDIT: Dies ist die generierte Autovervollständigung Markup.

Ich muss hinzufügen, etwas könnte wichtig sein: es bringt mich nach oben sogar auf RECHTSKLICK !!

Vielen Dank.

Answer 1

Ich war mit dem automatischen Vervollständigung mit dem gleichen Problem konfrontiert. Wenn Sie Autocomplete-Elemente auswählen, wird das Fenster nach oben verschoben.

Ich sah Ihren Kommentar here, und ich denke, Sie haben die Lösung.

Mit Hinweis, den Sie im obigen Link erwähnt haben, ging ich durch mcustomscrollbar.js Code und nur Zeilen 533 und 534 auskommentiert und yeppy es funktionierte für mich.

Danke für den Hinweis. Prost !!

Answer 2

könnte ein Anker-Problem sein? Was ist die href auf den generierten Elementen für die automatische Vervollständigung? Es wäre hilfreich, wenn Sie das HTML-Markup der generierten Autovervollständigung bereitstellen können.

vielleicht versuchen, diese Zugabe (nicht getestet) ...

$([auto-complete suggestions]).live("click", function(e){ 
e.preventDefault(); 
}); 

Answer 3

Eine neue Version von benutzerdefinierten scrollbars haben eine erweiterte Option autoScrollOnFocus.

Beispiel:

 $($element).find('> .scrollbars').mCustomScrollbar({ 
      horizontalScroll: false, 
      autoDraggerLength: true, 
      autoHideScrollbar: true, 
      advanced:{ 
       autoScrollOnFocus: false, 
       updateOnContentResize: true, 
       updateOnBrowserResize: true 
      } 
     });