谷歌浏览器表单单选按钮在结果页面的“返回”导航中设置选定值

时间:2014-06-05 02:34:12

标签: javascript html django forms google-chrome

我将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和无线电选择器的表单。典型的用户交互会在序列字段中生成文本,然后单击单选按钮。

然后,应用会在新页面上返回结果

现在,如果用户点击"返回" chrome上的按钮可以从结果页面返回到表单。文本框中输入了数据..但单选按钮被重置为其初始值。

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

当用户从Google Chrome中的结果页面浏览时,如何让表单记住该值。

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

我曾在某处读过一个解决方法是使用" html5"会话存储API,用于保存单选按钮的状态。这是处理此问题的最佳/唯一方法吗?

1 个答案:

答案 0 :(得分:2)

您可能想要使用此库: http://garlicjs.org/

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

  

Garlic.js允许您在本地自动保存表单的文本字段值,直到提交表单。这样,如果用户意外关闭了标签页或浏览器,您的用户就不会丢失任何重要数据。

     

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

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