I friends, friends in this video, we shall see the use of flask witf extension in a flask application.
Now, the user interface in a Web based application is generally created with the help of her HTML form
tag.
A statement provides a form tag which is used to create a user interface in which are using which the
user can enter the data input for that purpose.
There are different form elements available, such like input, radio, select, etc..
That means if you want to create a text box in which the user should be user should be able to type
certain data, what you do inside the form user input type is equal to text so that it will create a
text books input table equal to radio, it will give you radio buttons and so on.
So we are already aware of all these elements.
Now, the data in there by the user using that form is submitted to the particular you are all that
is given as a value of the attribute.
Class action is equal.
And generally, the method is used as the poster method.
Now, the data that is entered is posted to the U r l. which is mentioned in action, is equal to attribute
that is received by the server, the background server side script.
In this case, the application has to recreate all the form elements that subscript the server side
script has to.
Access the data that is sent by the form and use it for for processing not therefore it is very difficult
to render the form element because it is not a dynamic language.
So therefore, rendering of the form elements dynamically is not possible in Stearman estimate itself
being a static language.
Does not have any validation facility, whichever or whatever the data user has input, it cannot be
validated at most what you can do.
You can run some deLaski functions over the e-mail data and then send it to the server.
So such two major difficulties will be encountered when you create an user interface using this e-mail
form that the formula cannot be rendered dynamically and there cannot be there is no validation facility.
So to provide these two facilities, W-2 forms.
Package can be used.
It is a very flexible form rendering liability, and it also provides the validation support.
So the beauty of is it is an extension which brings the WP forms facility or features into our flask
application.
So flask the extension, what is that and what how to use the flask WTS extension?
That is the topic of this video.
Using this flask, the beauty of extension, you can define the form for use in your Python script itself,
if not, it doesn't have to be a stimulus.
But within your Python script, you can define the form first and then you use that particular Python
script to render an estimate template.
It is also possible to apply the validation over this form in a WTO form fields with the help of the
validation functionality that is available in WTO.
So that is the advantage of this WTO fixation.
So, Natalie, inside your flask environment, you have to install that extension by using the normal
or regular people utility install flask, the beauty of that is all you can incorporate this extension
into your flask environment.
There are two major classes.
Into this place, the beauty of extension, what is the form glass?
That formula is to be used as the base or pattern for the user defined for.
This is one secondly, the WP forms package.
He's also a very important part of the resource of this extension, it contains the definitions of various
farm fields which are equivalent to the.
Form attributes or form elements in it.
So what are what are the names of these foreign fields?
There is that field farm, which is equivalent to input papers will text in our estimate boolean field
is there where a certain form, certain field is likely to have only true or false values, which is
equal to input.
Time to check checkbox there.
Boolean field is equal.
Decimal field is the type of a text field where a number with decimal part can be entered into other
fields.
Another variation of text where only the integer can be displayed.
Radio field represents input equal to radio in our Estherville form element.
Select fields represent the select of the XML area is equal to the text area.
Enlistment password is equal to input type equal.
The password is very obvious.
And lastly, submit field is a very most often used field which is equal to input type, equal to submit,
because by pressing that data will be posted to the u r n, which is the target.
So these are some of the important forward fields in this flask WTS extension.
The summary of the court that you will use will help.
This is the form.
You will import the form from the duty of exchange and this is the first step, and you will also import
the different fields that you may be requiring in the design of the phone from their W2 forms.
So these two are important.
When that are necessary, then you design a form.
The form class should be based upon the patent formulas.
So the definition of.
The form will be glass, the name of my family is a contact form, for example, based upon the farm,
and then you define the different fields that you are intending to provide for the user to enter the
data.
For example, name is equal to TextField.
Which is which will now be equal to what input type is equal to text in our estimate.
So if you write such a contact form and then render this over the browser, then this will be equivalent
to this.
This is the equivalent Erskineville code that will be rendered.
So any number of fields will be given in the definition of your farm, in this case the contact form,
in addition to the fields that you have defined, there will be one additional field that will be automatically
generated, which is a series of toker.
What is this, CSIR?
It stands for cross site request forgery.
So in order to prevent this attack on your application, a hidden field is always inserted into the
render the data rendered form, and therefore, in addition to the name of the student or input people
to name input identical to text, which is the equal which is generated by this name is equal to textual.
In addition to that, one more field will be rendered.
Input identical to CSIR of token and type is equal to that.
Importantly, because in that case the user will not be able to use it.
That is how it can be.
It is used to prevent this forgery attack.
Some other fields can also be provided like, for example, radiophonic, if you want to use the this
is the caption or label and the choices can be given in the form of tuples, the value, the key and
the value the name and the value M stands for male F stands for women like that.
You can also, for example, integer feel if you want to use integer fill h.
Whatever data that will be input will be treated as an integer variable for each.
So such a form design is one aspect.
You can apply a validation to these forms of fees by using the validator class.
The new reforms package has it validated, plus these different kinds of validations or validators are
predefined in this W-2 forms package, for example, commonly used, validated validators.
I have shown in this table that are required if you apply this validation over a particular field,
then it will validate whether there is a data in it or not, whether the input field is empty or not.
Email is another important validator.
If you apply this, then it will check that the data are the Dextra table in a text box is conforming
or is according to the email conventions, that should be ad and then there should be a domain name
and dot, etc. etc. All those features will be verified.
IP address is another validator checks whether the text to enter is equivalent to or is in the same
order in which the IP address is written.
Linked validator checks whether the length of the string in the input will is in the given region,
given the range number range also is a validator where the the numeric text textfield the data in the
numeric text file is in between the range that is provided as a number is another validator you are
in which checks whether the that type of text is in the oral form or not.
So these are the validators.
We will use some of these.
For example.
TextField is the Farmville that I have used name is equal to TextField, this is, of course the caption
name of the squirrel validator applied, invalided are required.
So which means that there should be a data into the field.
If not, then it will raise an error.
Another example I can show email is equal to Texasville email.
In order to write email, I am providing a text file.
This is the caption to validate.
Those are applied when evaluators require, which means that there there must be certain that are typed
in it.
And secondly, it does not email which will verify whether the text or typewritten is according to the
email preconvention.
If not, it will raise the error.
Now, when these errors are raised by the validate function, then what will happen?
These error messages will be rendered to the template in the estimate template.
All these error messages are rendered dynamically by this format for messaging, for not named or errors,
for example, namely the field on which there might be some errors.
So those errors will be dynamically rendered by using the Ginge to templating syntax.
So such like all these facilities are provided in the flask WITF extension to create a form to render
the form as a template, then apply the validation and if the validation through certain errors, those
errors will be flashed on the template itself.
So all these mechanism I will show with the help of an example where a form will be their user enters
the data and if there is any error, errors will be displayed.
Otherwise a success message will be displayed on the browser.
So let us see an example of all these activities.
So I will now show you the use of W-2 forms, extension in a flask.
Lask application to the name of the extension is Flask.
Underscore the beauty of the first and foremost we are to ensure that this flask, the extension is
already installed in our flask involvement or not.
So the usual way of installing a particular module is by using the.
So this is the virtual environment in which we are working.
And using the pivotally, I will try to install the flask, the beautiful extension.
It says that this is already.
Present are installed in this environment.
If it were if it was not present, then it would have installed the flask WTS extension.
We can also verify whether.
This flask, WCF extension is present or not?
What I will do, I will.
Start the interpreter and try to.
Import.
Last, if if it accepts, then fine.
Otherwise, it will it will mean that the extension is not OK.
So come out of this.
Now, what are the components or what are the different called the snippets that are needed for the
rendering of the form?
So first you have to design the foam, this flask, underscore the beauty to the F module, contains
a glass or less form.
This farm is to be used as a base class for your user, user defined form class.
I'm calling it as contact form.
So this so my contact form is based upon these form class, which I am importing from the plus if it
also has.
A Marine Corps LSW deforms in which all the farm elements.
Like TextField, integer, full text area, etc, etc., all are present, so we have to import all
those that are needed to design this particular form.
So in my form, a textfield integer full text area will submit full, which is equal to the submit button
in the text in the HTML.
Really awful.
And the select will these many types of files I am going to use.
So I imported.
And I also want to apply certain validators.
To the subtext, feel some some, uh, you know, feels so I am also importing the validators and the
validation error.
So in the contact form class, the objects that are.
Declare his name is equal to TextField, this is the label of the text will name of the student and
the validation applied to this name feelies validation required if it needed the validation fails,
then the error message that should be displayed is, please enter your name.
Then another object is a radio field.
Object, I'm calling it a gender.
This is the label and.
The exclusive choices to be made are male and female.
So they are presented in the form of a list object in which to Stupples the.
The name of the variable and associated ception name and the caption that provided so this is the.
Gender field address is a text area, Phil.
Then I have to.
Again, provide a Texasville for e-mail, so e-mail is equal to TextField, this is the label and the
validation that I want to apply.
There are two types of validation.
One is that the value that is required will be verified.
If it is not at all, enter then the error message.
Please enter your email already.
And there is another validator I want to apply to.
This text will validate us, not email.
It will ensure that the.
Entry in this field is, according to our expert, the requirements of an email address.
Then there is an integer field goal, as is selection field or select field, which will give your dropdown.
And the user can make choices out of.
These two entries, uh, C++ and Python, so these are the actual text that will appear and these are
the two, uh, you know, names that are associated with each of them.
And then there is a submit field, which is equal to the submit button.
So this is how you had to design the form for us?
I am I am calling it a contact form in my execution.
Good, I have to import this contact form also.
So let us have a look at the execution side of our Python script.
So this is the application called.
Here, the flask application object is declared before which all the necessary.
Resources from the flask application are important, as well as the contact form that we have designed.
That is also important.
Ensure that there is a secret key in place.
Now, one new old rule is defined in this so-called contact accepts the matters get or post.
What is the associated view, function, contact and in which, first and foremost, create the object
of our contact form plus.
Right.
Now inside this contact function.
Verify whether the request method is used or not.
So obviously, when the user enters the localhost 5000 contact in the atmosphere of the browser, the
method will not be able to post, it will be get.
So that means this will be, you know, encountered.
Right, because it is the first time the user has directly entered this, you are also it will not be
a personal matter, but it is admitted.
So in case it is a matter, then what what it has to do, the browser will be redirected towards or
rather a template will be rendered.
All of the name contact that e-mail, which takes one attribute or one argument, which is the form
is equal to our form object.
So it will go into the contact, that estimate will have a look at this counterprotest even a little.
If, on the other hand, the is boost.
But the validation of the form which form the contact form that we have designed, if the validation
fails, then a message will be flashed.
All fields are required where this flash will appear, it will appear in the next review function when
they render the template contact rotation will be rendered on the top of it.
This flashmob stage will be displayed along with any error messages that the form might have generated.
So in either way.
If the matter is forced, but there are errors.
The contact estimate will reappear.
Or if the method is not post, the contact, not estimate will be appear appearing if the validation
is successful, if the post method is there, validation is successful, then the success that estimate
will be rendered.
It will just display a success message.
OK, so this is the execution part of our Python script.
So what remains?
I will look at the contact that estimate.
So this is the contact or the e-mail, which is basically the rendering, the form.
That we have designed.
So.
In this form, all the form elements that we have designed.
Using our W-2 forms.
You know, package.
Those elements are rendered here, for example.
We have seen that.
Any of these?
Form elements that are used from the W.T. forms in addition to whatever, you know, elements or form
fields that you design one additional.
Element is created, which is a hidden tag.
And in addition to that, we are we are defined in name, form, field, it has two attributes, label
and name.
Gender has a label.
And.
Gender as a field address has a label address, a diffuse e-mail has a label and field is language,
etc. and lastly, the form segment.
So all we are doing is dynamically rendering.
The form elements.
A different form will that we have defined in our contact form into this browser web page by using the
ginger to template.
You know, mechanism, you can see that all these formed odd name.
Paumgarten name is.
You know, the name of the.
Name infield, which we are defined in the contact form, so that is dynamically rendered by using this
double curlee record in order to escape out of the.
So this is how the farm is rendered dynamically on the browser before which.
Before which if the farm has already been posted and if it encounters any error or messages, those
are, you know, flashed.
On to the browser, for instance, if there are any messages like there was one message, all the files
are necessary.
That message will be displayed on the browser with the help of.
Get flashing messages and taking one message at a time.
In our case, there will be only one message.
So that will be displayed here.
If while encountering the validation of the name feel, if it encounters an error, then that message
will be displayed here.
If while and while validating the email feel if it encounters error, that will be displayed here.
So if the farm is happening for the first time, the entire farm will be displayed, if it is appearing
subsequently, then if there are any errors or messages, those will be fleshed.
Now, this is our contact, not even so, we have seen the form plus the contact form, the application
side of the form example in which.
All the.
You are jealous and associated, you functions are defined, and this is the correct form of contact,
not esteem, in addition to that, there is a there will be a success.
The artist will also.
Which will just print out the message from postered successfully if there are no errors found in the
farm after the farm is posted.
So this is all the code that we have now.
We will do the.
All the activities, one by one, to show that this is out of the WTO forms are used.
So let us come to the command prompt and execute our Python script named as Flaum.
Example.
NCUA.
It start the server.
OK, so now we shall go to the browser and give the URL as localhost 5000 slash contact.
So in the browser.
Backslash.
Contact.
So the contact form is displayed.
OK, so different possibilities we shall generate and see what are the error messages.
For example, I will.
Leave this name on the screen blank.
Will the rest of the elements?
And.
Make the selection.
You see all the fields that require.
Secondly, I will enter some.
Element here.
But I will.
Purposefully enter the e-mail in some.
Environmental.
It will say, please enter your email address, which is not proper.
If, on the other hand, if all the elements are all the entries in the form are probably mention.
Then, of course.
The form will be validated.
And the message from postered successfully will appear so that how.
A user friendly.
Form can be designed by using the flask WITF extension in a flask application.