Google chrome表单单选按钮在从结果页“返回”导航时重置所选值

google chrome form radio button resetting selected value upon "back"navigation from results page

本文关键字：导航 返回 单选按钮 表单 chrome 结果 Google      更新时间：2023-09-26

我有一个从Django定义为

的表单
from  django.forms.widgets import RadioSelect
class SequenceInputForm(forms.Form):
    sequence = forms.CharField(widget=forms.Textarea, validators=[validate_valid_dna_sequence])
    organism = forms.ChoiceField(widget=forms.RadioSelect(), initial=1,choices=[(1,"Human"),(2,"Rat"),(3,"Mouse")])

django模板中的单选按钮呈现为

 {{ form.organism }}

在模板上呈现一个带有简单TextBox和单选器的表单。典型的用户交互结果是序列字段中的文本和单击单选按钮。

应用程序然后返回结果在一个新的页面

现在如果用户点击"返回"按钮从结果页返回到表单。文本框中输入了数据，但单选按钮被重置为初始值。

输入值的内存不足仅在Google Chrome中出现。在Firefox和IE中使用相同的应用程序代码…表单会"记住"它的单选按钮的选择值。

当用户从Google chrome的结果页面返回时，我如何使表单记住值。

很抱歉，浏览器特定的行为给我的印象是它需要一个浏览器特定的解决方案，可能不在Django代码中。

我曾在某处读到一个解决方案是使用"html5"会话存储API来保存单选按钮的状态。这是最好/唯一的处理方法吗?

您可能喜欢使用这个库:http://garlicjs.org/

它完全符合你的要求，即使用HTML5会话存储:

Garlic.js允许您在本地自动保存表单的文本字段值，直到表单被提交。这样，你的用户不会丢失任何宝贵的数据，如果他们不小心关闭他们的标签或浏览器。

它努力为可能想要使用它的UI/UX开发人员提供一个与javascript无关的界面。只需在表单标签中添加一些data-persist="garlic"，就可以开始了!

默认情况下，数据不会在提交时保存。您可以通过将data-destroy="false"添加到表单标记来更改此选项。

相关文章：