2011-10-11 22 views
25

メニューから項目を選択したときにフォームを送信しようとしています。私は検索フォームにクラスを設定し、ここにあるイベント選択を使用しています:http://docs.jquery.com/UI/Autocomplete#event-selectjQueryオートコンプリート:イベント選択

ここでキーボードを使って項目を選択すると(UPとDown)、それは機能します。しかし、マウスを使用して項目を選択すると、前に入力した値が表示されます。

チェックこのScreenRを:あなたがそう選択した場合、あなたはそれを取り消すことができるようにselectイベントのデフォルトの動作は、(after your event handler is finished runningが実行されるため

$("#searchform-input").autocomplete({ 
    select: function (a, b) { 
     $(".searchform1").submit() 
    } 
}); 

答えて

63

これは、次のとおりです。http://www.screenr.com/7T0s

これは私が送信するために使用するものです)。

これは、何かをクリックすると、ウィジェットがinputに正しく挿入される前にフォームが送信されることを意味します。何を疑問に思うかもしれそうですが、私は、キーボードを使用するときになぜそれが動作しない、

$("#searchform-input").autocomplete({ 
    select: function (a, b) { 
     $(this).val(b.item.value); 
     $(".searchform1").submit() 
    } 
}); 

を今:あなたは、ウィジェットが正常にあなたのために何を行うことによってこの問題を解決することができるはず

focusイベントが実際inputでフォーカスがあるアイテムを移入するため

はこれが起こる(よく見て、あなたが上に移動し、ドロップダウンリストとしてinputが読み込ま表示されます)。アイテムをマウスオーバーすると、focusイベントが呼び出され、inputが入力されます。 enterキーを使用して何かを選択すると、正しい値はfocusイベントのためにinputになります。

+2

1は、それを私にビート...試してみる[このデモ](http://jsfiddle.net/Mottie/SmycH/) – Mottie

+0

信じられないほどを!ありがとうございました。 – jQuerybeast

+0

@jQuerybeast:問題ありません! –

-2

Hehe。非常に難しいこの1つ、しかし信じられないほど簡単に解決する。 selectイベントの後に関数を500ミリ秒遅らせるだけです。それは完全に動作します。仕事は終わった! :)

$("#searchform-input").autocomplete({ 
select: function (a, b) { 
    setTimeout(submit,500); 
}}); 
+2

実際の解決策がある場合、タイミングに頼らないでください。 –

関連する問題