6

我最近发布了这个问题:jqgrid edit form autocomplete="off" by default, how to change to autocomplete="on"因为我注意到默认情况下 jqGrid 编辑表单为所有输入元素提供了autocomplete="off"属性。我认为这就是为什么 Web 浏览器不会为 jqGrid 编辑表单实现通常的自动填充功能的原因。修复此问题并使所有输入元素都具有该autocomplete="on"属性后,jqGrid 编辑表单仍然没有自动填充。

有谁知道为什么自动填写不适用于这些表格?表单是通过 ajax 提交的,所以我不确定这是否会影响它。

为了清楚起见,我不是在谈论jQuery 的autocomplete(). 我说的是现代网络浏览器(Chrome,FF)内置的表单自动填充功能。

例如,请在此处查看我的 jsfiddle 示例表单。您可以用您想要的任何内容填写表格,然后单击submit。刷新页面并再次填写。您的浏览器应该已经记住并建议了第一次填写的值。这就是发生在我身上的事情。

另一方面,如果您在此处查看jqGrid 编辑示例。选择一行并单击小编辑按钮(看起来像一支铅笔)。您不能更改第一个字段,但可以更改其他字段。在其他字段中放置您想要的任何内容,然后单击submit。刷新页面再试一次。我从许多计算机以及 FF 和 Chrome 中体验到的是,此表单不记得任何过去的条目。

这就是问题所在,你是否也遇到同样的事情?如果是这样,您知道是否可以使这些 jqGrid 表单与浏览器的自动填充功能兼容?

谢谢!

4

2 回答 2

4

虽然所有浏览器处理表单字段的存储和自动完成的方式略有不同,但它们都依赖于提交的表单来存储表单字段本身的值。由于 jqGrid 通过 AJAX 处理表单(更新按钮是链接而不是提交按钮),表单本身从未实际提交,这反过来又不允许浏览器存储字段值以供以后通过自动完成使用。

强制浏览器存储字段值的一种方法是创建一个<iframe />,克隆<form />,将克隆的附加<form />到 中<iframe />并将其作为 AJAX 表单提交过程的一部分提交。

以您的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

尽管有一些代码可以准确地从您的问题中查看。我将跳转到一个假设,即由于浏览器限制,这完全有可能,具体取决于浏览器。但是也。这可能是几件事之一。要么您的表单元素未包含在<form></form>标签中,因此启用自动完成的浏览器无法获取您想要自动完成的元素。

2 你为你的元素使用了不起眼的名字。通常启用自动完成功能的浏览器会查找常用的表单元素名称,例如:first_name、firstname、name、email、username、street1、street_one.. 等等。

3 如果您通过 javascript 在类似功能的文档上动态加载网格,则完全有可能。自动完成功能已经检查了页面上是否有任何表单可以自动完成。在这种情况下,浏览器自动完成功能可能只是在您的文档准备好之前运行。如果事实证明是这样的话..这个帖子可能会帮助你走上正确的道路

jQuery 自动完成触发更改事件

于 2012-09-21T02:52:59.837 回答