`
marlonyao
  • 浏览: 253471 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

一个简单的Form向导实现

阅读更多
Django的contrib中带了个FormWizard,但是我觉得它实现得很不好,不易使用,扩展性不强,所以就自己实现了一个。这里只说用法,首先得定义一个自己的Wizard,它继承SimpleWizard,并在构造函数中传递每一步需要的Form。
class TestWizard(wizard.SimpleWizard):
    def __init__(self):
        super(TestWizard, self).__init__(
            (
                ('step1', Form1),
                ('step2', Form2),
                ('step3', Form3),
            )
        )

test_wizard = TestWizard()


上面定义的Form1,Form2和Form3就是普通的Form,继承于普通的forms.Form。step1, step2, step3则是用来标识每一步的名称,不像contrib中的FormWizard,我没有使用数字来标识每一步。实际上,你可以使用任何对象来标识每一步,包括数字,但是使用字符串就足够了。

然后需要定义TestWizard的render和done方法:
class TestWizard(wizard.SimpleWizard):
    # return (template_name, context) tuple
    def render(self, step, **kwargs):
        return ('wizard_%s.html' % step, None)

    def done(self, wizard_status, request, **kwargs): 
        return render_to_response('wizard_done.html', {
                'wizard_status': wizard_status,
            }, context_instance=RequestContext(request)
        )

render方法返回一个包含两个元素的tuple,第一个用表示用来渲染每一步的template名称,第二个是传递给template的context,它是一个dict对象。默认传递给模板的有两个对象,一个WizardStatus对象,可以通过wizard_status来引用它,它包含step和data两个属性。step标识当前的步骤,data表示之前所有填过的数据,这是一个dict对象,里面的数据都是cleaned_data,这表示如果你在Form中定义了一个IntField,那么data对那个字段返回的数据将是int类型,而不是string。

done方法则是wizard最后一步所做的事情,它通常是会将所有的数据保存数据库,然后重定向到一个新的数据展示页面。这里的例子只是显示wizard_done.html页面,并传递wizard_status对象。

下面来看看模板的写法:
wizard_step1.html
<form action="." method="POST">
    <h2> {{ wizard_status.step }}</h2>

    {{ form.as_p }}

    {{ wizard_status.as_hidden }}
    <input type="submit" value="Continue" />
</form>

最关键的是必须要包含{{ wizard_status.as_hidden }},因为我使用隐藏字段来保存上次填充数据。类似的完成wizard_step2.html,wizard_step3.html。

最后别忘了添加test_wizard到urls.py中:
urls.py:
urlpatterns = patterns('',
    (r'^test_wizard/$', views.test_wizard),
)


附上TestWizard的完整代码:
views.py:
class TestWizard(wizard.SimpleWizard):
    class Form1(forms.Form):
        field1 = forms.CharField(max_length = 20)

    class Form2(forms.Form):
        field2 = forms.CharField(max_length = 20)

    class Form3(forms.Form):
        field3 = forms.CharField(max_length = 20)

    def __init__(self):
        super(TestWizard, self).__init__(
            (
                ('step1', self.Form1),
                ('step2', self.Form2),
                ('step3', self.Form3),
            )
        )

    # return (template_name, context) tuple
    def render(self, step, **kwargs):
        return ('wizard_%s.html' % step, None)

    def done(self, wizard_status, request, **kwargs): 
        return render_to_response('wizard_done.html', {
                'wizard_status': wizard_status,
            }, context_instance=RequestContext(request)
        )

test_wizard = TestWizard()


最后是wizard.py,放在附件中。

分享到:
评论

相关推荐

    AngularJS 使用 UI Router 实现表单向导

    通过为不同步骤的表单定义不同的状态,可以实现一个步骤一个步骤引导用户完成表单填写的过程。 在使用UI Router实现表单向导时,你需要在你的AngularJS应用中引入ui.router模块。这通常通过在HTML文件中引用ui-...

    一个动态的vuejs表单向导来更容易分割表单

    "一个动态的vuejs表单向导"是针对这个需求而设计的一个组件,它帮助开发者更轻松地创建分步表单,提升用户体验。 动态表单向导通常用于将大而复杂的表单拆分为多个步骤,以便用户可以逐步填写,降低填写难度。Vue....

    C# 向导控件,有示例

    - 在C#代码中,创建一个主窗体(Main Form),用于承载整个向导的容器。 - 将各个步骤的窗体或用户控件添加到容器中,根据向导的流程设置它们的显示顺序。 - 编写按钮事件处理程序,如“下一步”和“上一步”,在...

    C# 向导控件

    在.NET Framework中,C#语言提供了丰富的控件库,其中包括“向导控件”(Wizard Control),这是一个在用户界面设计中十分有用的功能组件。向导控件通常用于引导用户逐步完成一个复杂任务,通过分步的方式展示信息和...

    ORACLE_FORM开发实战

    - 在开发环境中选择新建表格,从而创建一个 FORM 文件。 2. **建立数据块**: - 使用数据块向导来创建数据块。 - 输入表名并刷新以显示字段名。 - 选择所有字段并将其添加到数据库项中。 - 使用默认设置完成...

    C#封装的向导对话框

    在提供的“FormWizard”文件中,我们可以推测这是一个实现了向导功能的C#窗体类。这个类可能包含了多个子窗体或者用户控件(UserControl),每个代表向导的一个步骤。它还可能有以下几个核心组成部分: 1. **步骤...

    jQuery填写表单带步骤指引的表单向导提示插件

    下面是一个简单的示例,展示如何在HTML和JavaScript中设置和初始化插件: ```html &lt;!DOCTYPE html&gt; 表单向导示例 &lt;script src="path/to/jquery.min.js"&gt;&lt;/script&gt; ...

    struts中使用向导实例

    首先,我们需要创建一系列Action类,每个类对应向导的一个步骤。这些Action类负责处理用户的输入,进行业务逻辑处理,并决定下一步骤应跳转到哪个页面。ActionForm类则用于封装用户提交的数据,每个步骤的表单数据...

    Spring mvc 入门向导

    Spring MVC 是一个强大的Java框架,用于构建Web应用程序,特别是企业级的Web应用。它作为Spring框架的一部分,提供了模型-视图-控制器(MVC)架构模式的实现,简化了开发流程,提高了代码的可测试性和可维护性。在这...

    jquery.formwizard-3.0.5

    `jquery.formwizard-3.0.5` 是一个基于 jQuery 的插件,专门设计用于创建向导式的表单。在Web开发中,向导式表单通常用于分步骤引导用户填写复杂或较长的表单,以提高用户体验和数据输入的效率。通过这个插件,...

    ORACLE_FORM_开发实战

    1. **创建Form**:在Oracle Forms中,开发过程始于创建一个新的Form。这通常通过File菜单中的New命令开始,随后选择Table选项,以便创建一个新的表单。这一过程涉及到多个步骤,包括数据块的建立和布局的设计。 2. ...

    基于jquery实现一个滚动的分步注册向导-附

    主要元素包括一个`&lt;form&gt;`标签,一个用于显示步骤状态的`&lt;ul&gt;`列表(`#status`),以及一个包含所有步骤的`&lt;div&gt;`(`#wizard .items`): ```html &lt;form action="#" method="post"&gt; &lt;!-- 步骤列表 --&gt; &lt;!-...

    C#创建windows服务+Form+Web调用服务

    本项目"创建windows服务+Form+Web调用服务"结合了三种技术,旨在实现一个可以被用户界面(Form)和Web应用调用的后台服务。 1. **C# 创建 Windows 服务**: 在C#中,我们通常使用`System.ServiceProcess`命名空间...

    PowerBuilder .NET Web Form

    **灵活的部署选项**:创建.NET Web Forms Application Target时,可以选择将现有PowerBuilder Application转换为Web应用,或从零开始构建一个新的.NET Web Forms Target。无论哪种方式,最终都将得到一个包含.NET ...

    css3+lodash.js用户反馈表格步骤向导代码

    "css3+lodash.js用户反馈表格步骤向导代码"就是一个这样的解决方案,它利用了现代CSS3技术和JavaScript库lodash.js来创建一个引导用户逐步完成反馈提交过程的交互式界面。下面将详细介绍这个项目的相关知识点。 1. ...

    html5用户注册登录向导

    总结起来,"HTML5用户注册登录向导"是一个利用现代Web技术,结合HTML5、CSS3和jQuery,实现的高效、美观的网页模板。它注重用户体验,提供清晰的交互流程,同时也考虑到了数据验证和安全性。开发者可以参考这个模板...

    formwizard:基于 jQuery 的表单向导应用程序

    `formwizard` 是一个基于 jQuery 的强大表单向导插件,它为创建分步式、交互性强的表单提供了便利。在这个详尽的解析中,我们将深入探讨 `formwizard` 的核心功能、使用方法以及如何优化你的表单用户体验。 ### 一...

    Create an Outlook 2010 Form Region by using VSTO 2013

    在本文中,我们将深入探讨如何使用Visual Studio Tools for Office (VSTO) 2013来创建一个针对Outlook 2010的自定义Form Region,以便更有效地管理和组织您的联系人信息。首先,我们需要理解VSTO在开发Outlook加载项...

Global site tag (gtag.js) - Google Analytics