Odoo 16 Development Book

Input from website users

Website development tutorials often require you to create forms that receive input from website users, called visitors. Use the Survey_form module to indicate user input for your site. We need to create a new model to store the records added by the website visitors.

Here's how to create a model and corresponding fields in the Survey.Form model.

class SurveyForm(models.Model):
    _name = 'survey.form'
    name = fields.Char('Title', required=True)
    email = fields.Char('Email', required=True)
    phone = fields.Char('Phone', required=True)
    dob = fields.Date('Release Date')
    qualification = fields.Char('Qualification')

Add a view for the survey_form module as follows:

<record id="survey_form_tree" model="ir.ui.view">
    <field name="name">survey.form.view.tree</field>
    <field name="model">survey.form</field>
    <field name="arch" type="xml">
        <tree create="false">
            <field name="name"/>
            <field name="email"/>
            <field name="phone"/>
            <field name="dob"/>
            <field name="qualification"/>
        </tree>
    </field>
</record>

Add right access for the survey.module model in the ir.model.access.csv file.

Added a new model called Survey Form for demo purposes. Next, add a new HTML form template for entering data from your website.

To create a new root and template for the survey form page, perform the following steps.

Step 1: Create a new route in your controller file (main.py).

class SurveyFormController(http.Controller):
    @http.route(['/survey_form'], type='http', auth="user", website=True)
    def survey_form_view(self, **post):
        name = post.get('name')
        email = post.get('email')
        phone = post.get('phone')
        if name and email and phone:
            request.env['survey.form'].sudo().create({
                'name': name,
                'email': email,
                'phone': phone,
                'dob': post.get('dob'),
                'qualification': post.get('qualification')
            })
            return request.redirect('/survey_form?submitted=1')
        return request.render('survey_form.survey_form_template',
                              {'submitted': post.get('submitted', False)})

We created a route that submits a survey form. The function's **post argument accepts any query parameter in the URL. It also retrieves the form data submitted with the **post argument. The demo used the same controller to display a page and submit a vote. When it finds data in **post, it creates a new issue in the Survey.form model and redirects the user to the survey page with the submitted query parameters.

Site Visitor does not have permission to create new survey form records, so sudo() was used to create a survey form record. This is the case when a user submits a survey from her web page, and we need to create a survey form record. This is a practical example using sudo().

Step 2: Create an HTML form with the

<template id="survey_form_template" name="Survey Form">
    <t t-call="website.layout">
        <div class="container s_website_form">
            <h3>Survey Form</h3>
            <t t-if="submitted">
                <h3 class="alert alert-success mt16 mb16">
                    <i class="fa fa-thumbs-up"/>
                    Survey submitted successfully
                </h3>
                <a href="/survey_form">Submit another survey</a>
            </t>
            <t t-else="">
                <div class="row">
                    <div class="col-6">
                        <form id="form_survey_form"
                              action="/survey_form" method="POST">
                            <input type="hidden" name="csrf_token"
                                 t-att-value="request.csrf_token()"/>
                            <div class="s_website_form_rows row s_col_no_bgcolor">
                                <div class="form-group col-12">
                                    <label for="name">Name</label>
                                    <input type="text" class="form-control"
                                           name="name" placeholder="Enter your name"
                                           required="required"/>
                                </div>
                                <div class="form-group col-12">
                                    <label for="email">Email</label>
                                    <input type="email" class="form-control"
                                           name="email" placeholder="Enter your mail-id"
                                           required="required"/>
                                </div>
                                <div class="form-group col-12">
                                    <label for="phone">Phone</label>
                                    <input type="number" class="form-control"
                                           name="phone" placeholder="Enter your name"
                                           required="required"/>
                                </div>
                                <div class="form-group col-12">
                                    <label for="dob">DOB</label>
                                    <input type="date" class="form-control"
                                           name="dob" placeholder="dd/mm/yyyy"/>
                                </div>
                                <div class="form-group col-12">
                                    <label for="qualification">Qualification</label>
                                    <select class="form-control" name="qualification">
                                        <option value="">Select</option>
                                        <option value="pg">Post Graduation</option>
                                        <option value="ug">Graduation</option>
                                        <option value="higher_secondary">Higher Secondary</option>
                                        <option value="secondary">Secondary</option>
                                    </select>
                                </div>
                                <div class="form-group col-12">
                                    <input type="submit" class="btn btn-primary"
                                           value="Submit"/>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </t>
        </div>
    </t>
</template>

Now we created a template for a survey form web page. Adds a conditional partition that displays a success message when the form is submitted. The website uses all fields to get input from the user. However, csrf_token is used to prevent cross-site request forgery (CSRF) attacks. The user cannot submit the form unless it is used in the form. After submitting the form, the submitted data is received as the **post parameter of survey_form_view(). Update the module and open the URL /survey_form. This page allows you to submit a survey. After submission, you can view them in the corresponding Survey_form tree view in the backend.

If you want to disable csrf verification, you may be able to use csrf=False in your root.

@http.route('/url', type='http',auth="user", website=True, csrf=False)

You can restrict get requests by including method parameters in the route

like this:

@http.route('/url, type='http', method='POST' auth="user", website=True)
location

Calicut

Cybrosys Technologies Pvt. Ltd.
Neospace, Kinfra Techno Park
Kakkancherry, Calicut
Kerala, India - 673635

location

Kochi

Cybrosys Technologies Pvt. Ltd.
1st Floor, Thapasya Building,
Infopark, Kakkanad,
Kochi, India - 682030.

location

Bangalore

Cybrosys Techno Solutions
The Estate, 8th Floor,
Dickenson Road,
Bangalore, India - 560042

Send Us A Message