Skip to content

Pasting in autocomplete is not triggering the AJAX request #861

Open
@WilsonSant

Description

@WilsonSant

Problem:

When you paste in the autocomplete field it does'nt trigger the Ajax request.

Steps to reproduce:

  1. Paste/Insert a name in the autocomplete (Let's say John)
  2. The autocomplete will trigger the Ajax request and we will see the "John" name in there.
  3. Don't select John. Click outside of the autocomplete so it triggers the focusout and the search is cleared.
  4. Paste John again. Now it will not search anymore. You can clear the field with cut (Ctrl + X on windows) and paste again many times you want, it will not trigger the ajax search anymore.

My configuration for the autocomplete:

$('#student_name').devbridgeAutocomplete({
    serviceUrl:'service.php',
    paramName:'student_name',
    params:{
        request:"getStudentsByName",
    },
    showNoSuggestionNotice: true,
    noSuggestionNotice:messageNoSuggestion,
    autoSelectFirst:false,
    deferRequestBy:300,
    minChars: 2,
    noCache:true,
    triggerSelectOnValidInput:false,
    transformResult:function (response, originalQuery) {
        return {
            suggestions: $.map(JSON.parse(response), function(student)  {
                return {
                        name:student.student_name,
                        data:student.id
                    }
            })
        }
    },
});

Solution

So, debugging i found that the problem was in the "onKeyUp" function on line 451 of jquery.autocomplete.js . Is on the line 466 if

            if (that.currentValue !== that.el.val()) {

If you search and don't select like in the steps explained earlier, the that.currentValue would be the last requested value (in our case was John) and when you paste it again the that.el.val() would be John (the same as the currentValue).
So it will never fall under the if. My provisional solution right now is doing an else with that.currentValue = '':

            if (that.currentValue !== that.el.val()) {   
                that.findBestHint();  
                if (that.options.deferRequestBy > 0) {  
                    // Defer lookup in case when value changes very quickly:  
                    that.onChangeTimeout = setTimeout(function () {  
                        that.onValueChange();  
                    }, that.options.deferRequestBy);  
                } else {  
                    that.onValueChange();  
                }  
            } else {  
                that.currentValue = ''  
            }

It fixed the problem, but i don't know if that's the best solution or if will ending up creating new bugs.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions