2009-08-12 39 views
2

我們需要,如果用戶輸入文本從一組自動完成建議選擇調用處理程序的能力檢測。如何當用戶忽略的jQuery自動完成建議

在我們的案例中,輸入的文本是否與任何自動完成值匹配並不重要 - 我們只關心用戶是否點擊/選擇自動完成值或不是

表單的工作方式是,用戶開始輸入聯繫人的最後名稱,並得到帶有自動完成建議,包括聯繫人的全名和公司。如果用戶選擇其中一個自動填充建議,我們填充多個字段。這一切工作正常。

了新的要求是,如果用戶沒有選擇的建議之一,我們需要空出多個領域 - 這是我們想用從自動完成庫調用處理程序來實現。

看着previousanswers,它看起來並不像我們能做到這一點與Jörn Zaefferer's autocomplete plugin,但如果你有一個補丁或一些想法如何實現該功能,這是我們想嘗試,並將它推到庫中。

回答

0

我認爲最簡單的方式做這將是存儲的文本建議的陣列,它與什麼在文本框中輸入實際比較。做這onblur或onsubmit。在數組中查找實際條目...如果它不存在,那麼他們輸入他們自己的文本。

+0

有兩個問題:1微不足道 - 用戶可以故意忽略自動完成,如果額外的元信息是錯誤的 - 即輸入「Siemer」可能會自動完成與「安德魯Siemer(StackOverflow)」 - 這將填充「Siemer」,「Andrew」和「StackOverflow」三個字段 - 但他們忽略了這個選項,因爲他們正在爲Acme Corp.的Bob Siemer輸入信息。 其次,事件排序是一場噩夢。 onsubmit太晚了,onblur與自動完成工作方式衝突(onblur會在用戶使用鼠標選取自動完成值時觸發,導致競爭條件)。 – searlea 2009-08-12 18:10:52

0

即當用戶選擇結果的插件將觸發事件result。只需在頁面加載時將變量初始化爲true,然後在「結果」中將其設置爲false,然後檢查它是否爲真。像

(function() { 
    var typed_in = true; 
    $("#auto").bind("result", function() { typed_in = false }); 
    $("#form").blur(function() { 
    if (typed_in) { 
     // do stuff 
    } else { 
     // do other stuff 
    } 
    typed_in = true; 
    }); 
)(); 
+0

我讀到建議使用全局狀態變量?我們需要使用scoped/closured/expando變量來迎合多個自動填充字段。更大的問題:當我們試圖幫助填充表單而不是實現驗證時,我們無法掛鉤到form.submit(fn)中(即,我們需要鉤住'focus(fn)'或'blur(fn)當用戶在表單中工作時,不要在完成後單獨填寫) – searlea 2009-08-19 12:30:23

+0

ok,然後使用帶有閉合變量的onblur。示例已更改 – 2009-08-20 06:37:53

1

好東西,這裏是我做到了,萬一它幫助。每當自動填充字段未留下建議時,我就清除了隱藏字段的值。

我相信search()函數會執行所需的實際檢查,如果調用result()而沒有data元素,則知道未使用自動完成。

autocompleteField.result(function(event, data, formatted) { 
    if (data) { 
     //auto-complete matched 
     //NB: this might get called twice, but that's okay 
    } 
    else { 
     //must have been triggered by search() below 
     //there was no match 
    } 
}); 

autocompleteField.blur(function(){ 
    autocompleteField.search(); //trigger result() on blur, even if autocomplete wasn't used 
}); 
+0

此功能很好,除非用戶在自動填充中單擊結果,太早發起搜索 – 2010-01-14 00:37:21

+0

@npdoty,在哪裏使用結果方法以及如何使用?螢火蟲顯示方法沒有定義或bla bla bla。 – 2012-09-19 05:03:52

2

jquery自動完成有一些有用的功能,你可以用它來解決問題。 如果使用自動填充忽略然後sugestion u可以使用下面的代碼來選擇的值從收視率 - 邀請

假設你的自動填充輸入名稱爲「txtName的」,那麼你可以編寫代碼爲:

$('#txtName').change(function(me) { $('#txtName').search(); }); 
7

我所遇到很有意思的答案。它涉及jQuery插件如何管理其狀態。當我正在尋找在螢火(與firequery)我發現,當我點擊圖標表示DOM節點的jQuery的屬性(在HTML標籤)它顯示所有連接到一個節點的DOM和連接到該插件的數據是整個自動填充參數。因此我找到了解決方案。

$('#test').autocomplete({ 
    change:function(event, ui) { 
     var data=$.data(this);//Get plugin data for 'this' 
     if(data.autocomplete.selectedItem==undefined) 
      alert("manual"); 
     else 
      alert("selected");  
    } 
}); 

做什麼自動完成是,如果我們從列表中選擇,然後將selectedItem包含我們只是它的所有屬性中選擇的JSON對象。但是,如果我們按ESC或取消自動填充,它將被設置爲空。

+1

我找到了一個更多信息。其實你可以使用參數'ui',因爲它與selectedItem相同。所以沒必要走很長的路,但我保持上面的答案,以便您也可以使用其他參數。 – 2011-09-03 20:19:26

+0

你們究竟發現了這些伎倆......它簡直太棒了。 – Raghav 2012-02-28 06:56:20

相關問題