當按下回車鍵時，jQuery UI自動填充字段沒有提交

我正在關注關於此主題的Railscast，儘管自動完成功能可以工作，但我無法在用戶選擇一個項目並按下回車鍵時提交表單。我有這個（咖啡標記）代碼，但它似乎並沒有工作...任何人都可以看到我要去哪裏錯了嗎？當按下回車鍵時，jQuery UI自動填充字段沒有提交

jQuery -> 
    $('#search_bar').autocomplete( 
    source: $('#search_bar').data('autocomplete-source') 
).keydown (e) -> 
    $('#search_button').trigger "submit" if e.keyCode is 13

理想情況下，我希望它通過鼠標點擊選擇一個項目提交 - 但不知道這是可能的嗎？

更新：我已經試過這...

jQuery -> 
    $('#search_bar').autocomplete 
    source: $('#search_bar').data('autocomplete-source'), 
    select: (event, ui) -> 
     $(this).parents("form").submit()

...雖然它現在的作品，如果你使用鍵盤選擇項目（然後按回車），如果選擇通過項目鼠標單擊它只會發送您輸入的字符串，而不是自動完成下拉列表中的完整單詞。（我猜我需要的是用鼠標懸停的文本內容更新搜索字段？）

更新2：已排序！只需將其添加到末尾

focus: (event, ui) -> 
    $('#search_bar').val(ui.item.value)

來源

2012-08-22 A4J

使用select事件。 documentation here回車鍵被自動完成捕捉以關閉菜單並故意不傳播。選擇事件將觸發回車鍵和鼠標選擇。然而，點擊後，表單會在標籤有機會更改之前提交，因此必須先設置該值。根據您的數據源，您可能需要使用item.label而不是item.value。

$('#search_bar').autocomplete({ 
    source: $('#search_bar').data('autocomplete-source'), 
    select: function(event, ui) { 
     $(this).val(ui.item.value); 
     $(this).parents("form").submit(); // this will submit the form. 
    } 
})

我相信CoffeeScript的是這樣的

$('#search_bar').autocomplete(
    source: $('#search_bar').data('autocomplete-source'), 
    select: (event, ui) -> 
     $(this).val(ui.item.value).parents("form").submit(); 
)

來源

2012-08-22 17:06:23 Nal

打我吧... – jForrest

謝謝兩位！你知道這個代碼應該在coffeescript中嗎？我似乎無法得到它的工作：/ – A4J

那麼你的代碼現在是什麼樣子？ – jForrest

不知道很多關於咖啡的腳本，但是這是我會怎麼做在JavaScript

http://jqueryui.com/demos/autocomplete/

您可以使用'select'事件。當用戶選擇的東西，請提交：

$(".selector").autocomplete({ 
    select: function(event, ui) { 
     $('#theForm').submit(); 
    } 
});

我相當肯定這會照顧你的兩種情況。 onEnter和onClick。

來源

2012-08-22 17:08:58 jForrest

當按下回車鍵時，jQuery UI自動填充字段沒有提交

回答

相關問題