6

最近、次の質問を投稿しました: jqgrid edit form autocomplete="off" by default, how to change to autocomplete="on"autocomplete="off"というのは、デフォルトで jqGrid 編集フォームがすべての入力要素に属性を与えていることに気付いたからです。これが、Web ブラウザーが通常の jqGrid 編集フォームの自動入力機能を実装しない理由だと思いました。この問題を修正し、すべての入力要素にautocomplete="on"属性を持たせた後でも、jqGrid 編集フォームの自動入力はありません。

これらのフォームで自動入力が機能しない理由を知っている人はいますか? フォームは ajax 経由で送信されるため、これが影響しているかどうかはわかりません。

明確にするために、私はjQueryのautocomplete(). 私は、最新の Web ブラウザー (Chrome、FF) に組み込まれているフォームの自動入力機能について話しています。

たとえば、こちらのjsfiddleサンプルフォームにアクセスしてください。フォームに必要事項を入力して、 をクリックしますsubmit。ページを更新して、もう一度入力してください。ブラウザは、最初に入力した値を記憶して提案しているはずです。これが私に起こることです。

一方、jqGrid の編集例に移動すると、こちら. 行を選択し、小さな編集ボタン (鉛筆のような形) をクリックします。最初のフィールドは変更できませんが、他のフィールドは変更できます。他のフィールドに必要なものを入力し、 をクリックしますsubmit。ページを更新して、もう一度お試しください。私が多くのコンピュータと FF と Chrome の両方で経験しているのは、このフォームが過去のエントリをまったく記憶していないということです。

これが問題です、あなたは同じことを経験していますか？もしそうなら、これらの jqGrid フォームをブラウザの自動入力機能と互換性を持たせることが可能かどうか知っていますか?

ありがとう！

4

2 に答える 2

4

すべてのブラウザーは、フォーム フィールドの保存とオートコンプリートをわずかに異なる方法で処理しますが、フォーム フィールド自体の値を保存するために、送信されるフォームに依存しています。jqGrid は AJAX を介してフォームを処理するため (更新ボタンは送信ボタンではなくリンクです)、フォーム自体が実際に送信されることはありません。そのため、ブラウザーは、オートコンプリートによって後で使用するためにフィールド値を保存できません。

ブラウザにフィールド値を保存させる方法の 1 つは、 を作成し<iframe />、 を複製し、複製したもの<form />を に追加して、AJAX フォーム送信プロセスの一部として送信することです。<form /><iframe />

たとえば、この修正されたバージョンのJSFiddleを考えてみましょう。

上記の例では、「標準フォーム」に入力して送信し、ページをリロードすると、フィールドが期待どおりにオートコンプリートされます。「AJAX フォーム」に入力して送信し、ページをリロードすると、フィールドはオートコンプリートされません。最後に、「AJAX + iFrame フォーム」に入力して送信し、ページをリロードすると、フィールドがオートコンプリートされるはずです。

*注意: 上記の例は、Chrome、Safari、および Firefox でテストされています。マイレージは異なる場合があります。

完全を期すために、関連するコードを次に示します。

$('#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();
    });

これが役立つことを願っています！

于 2012-09-21T23:20:34.030 に答える
0

問題から正確に表示するコードがいくつかありますが。ブラウザによっては、ブラウザの制限により完全に可能であるという仮定にジャンプします。だけでなく。それはいくつかのことの1つかもしれません。フォーム要素が<form></form>タグでラップされていないため、オートコンプリートが有効になっているブラウザーは、オートコンプリートしたい要素を取得できません。

2 要素にあいまいな名前を使用しています。一般的にオートコンプリートが有効になっているブラウザーは、一般的に使用されるフォーム要素の名前 (例: first_name、firstname、name、email、username、street1、street_one.. など) を探します。

3 関数のようなドキュメントで JavaScript を介してグリッドを動的にロードする場合、完全に可能です。ページにオートコンプリートするフォームがあるかどうかを確認するために、オートコンプリートが既にチェックを行っていること。その場合、ブラウザーのオートコンプリート機能は、ドキュメントの準備が整う前に実行されている可能性があります。これが事実であることが判明した場合..この投稿は正しい道を歩むのに役立つかもしれません

jQuery AutoComplete トリガー変更イベント

于 2012-09-21T02:52:59.837 に答える