2012-09-13 128 views
6

我最近發佈了這個問題:jqgrid edit form autocomplete="off" by default, how to change to autocomplete="on",因爲我注意到,默認情況下,jqGrid編輯表單給出了所有輸入元素的autocomplete="off"屬性。我認爲這就是爲什麼Web瀏覽器不會爲jqGrid編輯表單實現通常的自動填充功能的原因。解決了這個問題並使所有輸入元素具有autocomplete="on"屬性後,jqGrid編輯表單仍然沒有自動填充。jqgrid編輯表單失去瀏覽器自動填充功能

有誰知道爲什麼自動填充不適用於這些表單?表單通過ajax提交,所以我不確定這是否影響它。

只是要清楚,我是不是談論jQuery's autocomplete()。我正在談論一種以表單自動填充功能構建的現代Web瀏覽器(Chrome,FF)。

例如,請轉到我的jsfiddle示例表格here。你可以填寫任何你想要的表格然後點擊submit。刷新頁面並重新填寫。你的瀏覽器應該有記住並建議值剛剛填補了第一次。這是對我來說發生的事情。

另一方面,如果您轉到jqGrid編輯示例here。選擇一行並點擊小編輯按鈕(看起來像一支鉛筆)。您不能更改第一個字段,但可以更改其他字段。把任何你想要的其他領域,然後點擊submit。再次嘗試刷新頁面。我從很多計算機以及FF和Chrome中遇到的情況是,此表單確實是不記得以前的任何條目。

這就是問題所在,你遇到同樣的事情嗎?如果是這樣,你知道是否有可能使這些jqGrid表單與瀏覽器的自動填充功能兼容嗎?

謝謝!

回答

4

雖然所有瀏覽器處理的存儲和略有不同的方式表單字段的自動完成,它們都依賴於表單被提交以便存儲表單字段本身的值。由於jqGrid通過AJAX處理表單(更新按鈕是一個鏈接而不是提交按鈕),表單本身並不會實際提交,這反過來又永遠不允許瀏覽器通過自動完成功能存儲字段值以備後用。迫使存儲的字段值的瀏覽器

的一種方法,是創建一個<iframe />,克隆<form />,追加克隆<form /><iframe />,並提交其作爲AJAX表單提交過程的一部分。

以你的JSFiddle這個修改後的版本爲例。

在上面的例子中,填寫'標準表格'並提交,重新加載頁面,並按預期自動完成字段。填寫'AJAX表單'並提交,重新加載頁面,並且字段不會自動完成。最後,填寫'AJAX + iFrame表單'並提交,重新加載頁面,這些字段現在應該自動完成。

*注意:以上示例已在Chrome,Safari和Firefox上進行了測試。你的Milage可能會有所不同。

爲了完整起見,這裏是relavent代碼:

$('#iframe_submit').bind('submit', function(e){ 
    e.preventDefault(); // Prevents Standard Submit 

    // Do AJAX Stuff Here... 

    // Create Clone of Form, Append to iFrame and Trigger Submit 
    // This Forces Autocomplete to Register 

    var $clone = $('#iframe_submit').clone(); 
     $clone.attr('id', 'iframe_clone'); // Only One ID Allowed 

     $('<iframe />').appendTo('body').contents().find('body').append($clone); 
     $('iframe').contents().find('#iframe_clone').submit(); 
    }); 

我希望這有助於!

+0

感謝您的澄清!如果jqGrid會在默認包中添加這個功能,或者有一個選項來啓用它,那將會很酷。 –

0

雖然有一些代碼完全可以從您的問題中查看。由於瀏覽器的限制,我將跳轉到完全可能的假設,這取決於瀏覽器。但也。這可能是幾件事情之一。您的表單元素不會被包裝在<form></form>標記中,因此啓用自動完成功能的瀏覽器無法選取要自動填充的元素。

2你的元素使用了不起眼的名字。通常自動完成的瀏覽器會查找常用的表單元素名稱,例如:名字,名字,姓名,電子郵件,用戶名,street1,street_one等等。

3如果你的文件就像函數一樣準備好,你可以通過javascript動態加載你的網格,這完全有可能。自動完成功能已經做了檢查,看看頁面上是否有任何表單可以自動完成。在這種情況下,瀏覽器自動完成功能可能只是在文檔準備好之前運行。其中,如果這原來是這樣的。這帖子可能會幫助您在正確的道路

jQuery AutoComplete Trigger Change Event

+0

請查看更新後的問題。有些例子可以嘗試。在例子中我選擇了奇怪的名字,所以這不是問題。另外我不是在談論你鏈接到的jQuery的'autocomplete'。謝謝您的幫助! –