[Erledigt] JQuery event. key(down/press/up) Problem

[Peytra]

Hallöle Mitprogrammierer !
Wir schon in der Überschrift beschrieben nutze ich die JQuery Bibliothek und bin auf ein Problem gestoßen.

Ich habe eine Suchleiste in welche man nur einzelne Begriffe eingeben darf, also Leerzeichen verhindert werden sollen. Im gleichen Moment schickt die selbe Funktion ein Ajax (POST) raus um eben eine Live-Suche anzuzeigen.

Also gebe ich z.B. soetwas ein:

"12345" und drücke dann "6" wird als Post-Variable nur "12345" übergeben, da ich dieses Request per Keydown auslöse, also die Funktion feuert bevor die "6" das Input-Feld erreiuch hat. Die Lösung für dieses Problem ist klar mit keypress oder keyup lösbar.

Nun kommt aber die zweite Schwierigkeit.

Von diesen 3 Events kann nur das keydown-event die Eingabe von ungewünschten Zeichen verhindern.

Hat jemand eine Idee, wie man diesen speziellen Fall lösen könnte?

Mein Jquery-javascript:

$('body').on('keydown', '#main_search',function(event){

        if(event.keyCode != 32)
        {
            if($(this).val().length > 3)
            {
                var url = 'eine URL ;)';

                $.post( url,{search:$(this).val()}, function(data) {
                    $('#pre-show-box').html(data);
                    $('#pre-show-box').show();
                });
            }
        }
        else
        {
            event.stopPropagation();
            event.preventDefault();
        }

    }); 

PS: Ich arbeite hier ohne JSON, da ich eh nur HTML von dem PHP-File erhalte.
MfG Peytra

[monolith]

In der Variable event findest du auch die gedrückte Taste (keyCode - aber auf Browser-Kompatibilität achten!). D. h. du könntest den String im keydown-Handler vervollständigen.

Besser wäre wohl ein geschickterer Umgang mit keydown und keypress.

Was spricht dagegen es so zu bauen?

    $('body').on('keydown', '#main_search', function(event)
    {
        if (event.keyCode == 32) {
            event.stopPropagation();
            event.preventDefault();
        }
    });  

    $('body').on('keypress', '#main_search', function(event)
    {
        if ($(this).val().length > 3) {
            ... // AJAX
            alert('AJAX request!');
        }
    });

[rudygotya]

Angenommen, der User sucht nach "12345" und der Ajax-Request (xhr) läuft gerade. User Bernd tippt nochmal ne 6 dazu => xhr abbrechen und neu suchen.

Anstelle von keyCode solltest du dir Event.which ansehen, das ist der über alle Browser hinweg normalisierte keycode. Event.stopPropagation brauchste nicht.

Das Ganze gibts auch schon fertig: http://api.jqueryui.com/autocomplete/

Die Eingabe von Leerzeichen sollte eine halbwegs gut gemachte Suche nicht stören - entweder im Backend wegfiltern oder mehrere Suchbegriffe durch whitespace getrennt akzeptieren.