jQuery autocomplete enter-Taste Problem

Ich habe ein Textfeld für eine Suche über jQuery autocomplete. Wenn ich etwas im Textfeld, es zeigt die Vorschläge, von denen keines ausgewählt ist.

Fand ich heraus, dass selectFirst: true wird nicht unterstützt. Wenn ich wählen Sie ein Element in der drop-down-Liste und drücken Sie die EINGABETASTE, es ist in Ordnung.

Das problem ist, dass wenn Benutzer app für apple ein und drückt die enter-Taste, es wird versucht, das Formular zu senden mit app. Das Formular soll nur abgeschickt werden, die mit einem der Werte aus der Dropdown-Liste.

Habe ich versucht zu deaktivieren, das Formular Absenden auf Eingabe drücken, so dass ich könnte senden Sie das Formular aus JavaScript, konnte aber keine Lösung finden.

Hier ist mein code:

$("#searchtext").autocomplete({
    source: path + 'autocompletesearch?category=' + $("select[name='category'] option:selected").val(), 
    width: '500px', 
    matchContains: true, 
    select: function(event, ui){
        $(".searchform").attr("action", path + "fullproductinfo/" + ui.item.id);
        $("input[name='searchid']").val(ui.item.value);
        $(".searchform").submit();
    }
});

Und meine form:

        <form method="post" action="search" class="searchform">
            <div class="searchdiv">
                <input type="text" id="searchtext" name="searchtext"
                    placeholder="Search a product or a brand" autocomplete="off"/>
            </div>
            <div class="searchbutton">
                <input type="button" name="btnsearchproduct" value="Search" />
            </div>
            <div class="clear"></div>
        </form>

Beachten Sie, dass es <input type='button' und nicht 'Unterwerfen', also Standard-enter mit " nicht arbeiten sollte form. Es ist die AutoVervollständigen-ich denke, das ist dem Absenden des Formulars auf "Absenden".

  • Wäre es in Ordnung, wenn wie Sie erwarten, dass selectFirst option können Sie die erste option, um fokussiert werden, standardmäßig?
  • Ja, das wäre am besten, aber selectFirst nicht funktioniert
InformationsquelleAutor Ashutosh | 2014-07-10
  1. 14

    Wenn Sie mit dieser: http://jqueryui.com/autocomplete/

    Dann wollen Sie erste Element zu autoFocus ist, können Sie diese option jetzt:

    $( ".selector" ).autocomplete({ autoFocus: true });

    Erwähnt in der Dokumentation: http://api.jqueryui.com/autocomplete/

    BEARBEITEN

    Da haben Sie die enter-Taste Ausgabe, können Sie versuchen, wie diese:

    $(".selector").keydown(function(event){
    if(event.keyCode == 13) {
      if($(".selector").val().length==0) {
          event.preventDefault();
          return false;
      }
    }
 });
    InformationsquelleAutor j809
  2. 3

    Wenn Sie mit jquery ui für auto komplett, alles, was Sie brauchen, ist die Angabe der Autofokus: true".

    Wählt er automatisch das erste Ergebnis und wenn drücken Sie enter-Taste wird das erste Ergebnis.

    $( ".selector" ).autocomplete({
  autoFocus: true,
  source: function (request, response) {
    //your code
  },
  select: function(event, ui) {
    //your code
  }
});
    InformationsquelleAutor Annie C
  3. 0

    Ich hatte ein ähnliches Problem & das ist, wie ich es behoben

    if ($(".selector").val().length > 0) {
var options = $(".selector").autocomplete("option");
var fromAutocomplete = false;

jQuery.each(options.source, function(index, device) {
if ($(".selector").val() == options.source[index]) {
    fromAutocomplete = true;
}
});

if (!fromAutocomplete) {
$(".selector").val("");
    $(".selector").attr("disabled", false);
    return false;
}
}
    InformationsquelleAutor AK Imran
Schreibe einen Kommentar