Using Flask-WTForms With Flask-Bootstrap

[@prettyprinted]

Join my free course on the basics of Flask-SQLAlchemy: prettyprinted.com/flasksql

[@fzhcary]

This is exactly what I need. Help me a lot on get started on flask with bootstrap without going too deep into front end development. Thank you so much!!!

[@prettyprinted]

You're welcome! Thanks for watching.

[@divusiulius7539]

Until I started following your Flask tutorials, I have been having a lot of difficulty with other people's Flask Bootstrap tutorials. All the difficulties with Flask usually start with Bootstrap. You however seem to have all the answers. What a damn relief that is! I can't speak for other people but, I know I could use a bit more information (tutorials) on NavBars and other Bootstrap CSS, JS examples. Don't stop now! And I'm well aware that these video are more than a year old. But in this case, more is better. Thank You Anthony for your badly needed contribution.

[@prettyprinted]

I'm glad you like the video. I definitely want to cover Bootstrap more. I'm thinking when they update the library to support Bootstrap 4 I'll make more videos.

[@divusiulius7539]

Are there any known conflicts or issues between Flask and Bootstrap that you may know about? I was trying to get the basic Navbar working. No luck! All that would show on the web-page was the title of the navbar and nothing else. I messaged the guy that offered the tutorial as well as other tutorials using the same CDN bootstrap, and none of them ever get back to me. Your tutorial was the only one that got real results.

[@prettyprinted]

There shouldn't be any conflicts between Flask and Bootstrap. I can only help though if you tell me specifically what's going wrong.

[@jakovkusic4219]

These videos are so good that they should be part of official Flask documentation.

[@prettyprinted]

Thanks for watching!

[@gurucode.studio]

The best Flasker on KZbin , enjoyed the video as always , thanks :)

[@dmays67]

Kinda took a dive in the deepend doing the flask website tutorial then trying to incorporate bootstrap, sass and wtf. Realised error of my ways so thanks for providing digestible chunks of flask to improve my understanding :)

[@bootupgeek146]

Thanks a lot sir for this amazing video. You just made my work so much easier. I didn't know that library like this existed.

[@prettyprinted]

You're welcome! Thanks for watching.

[@karangujrati679]

Yes, I would love to watch the same type of video for a complicated example. It will clear my concepts better! Thanks!

[@prettyprinted]

I'll see what I can do.

[@mileshill4804]

Great videos on Flask. Keep them coming!

[@prettyprinted]

I will! Thanks for watching.

[@Bigboned85]

I'd be interested in seeing how you would do something similar with straight bootstrap. Very useful to know how wtforms integrates with bootstrap-like libraries. Plus reduces dependencies 😊

[@prettyprinted]

It would be like my original videos on WTForms, but instead of using plain inputs, you'd use inputs with the Bootstrap classes.

[@dannycorganrg1]

Anthony, Love your tutorials, they are the best!!! (now I've flattered you ...) any chance you could do a demo using the bootstrap4 html5 for a concertina form, I'm lost with that one. Danny

[@rushey_1771]

Thanks..This is what i needed..😊pls do more videos about this😍

[@DutchRider]

props on this mate! this makes life much easier for me :)

[@Juniorduke1]

Love your vide keep it up bro

[@baxiry.]

thank you Anthony

[@prettyprinted]

You're welcome! Thanks for watching.

[@mirham3802]

Hi Anthony, Best vids ever! How Can we use bootstrap 4? And why do I get the HTML5 validation instead or wtf.validators?

[@morganprott5696]

Great video! I am using the wtf.forms but also want to add css styling to the form. How would i go about integrating css styling into a wtf form?

[@prabhatmohanty1164]

I want to do a step by step questionaire in flask by using radio / checkboxes and text field in a multiple page form. Also want to use reference image in some of them. A tutorial in that effect would be nice.

[@xxgameplaysxx5891]

Nice video! Why do you only have1 button there? Since wtf.quick_form(form) automatically generate 1 button and your line 13 create a new one then there should be 2 buttons right?

[@vic_shine]

Thx a lot! Any plans for create lessons 'bout Flask-Babel extension? ;)

[@prettyprinted]

Flask-Babel is on the list of videos to make.

[@teamalt2herbals580]

Can we do a demo of an example of Multipart Form in WTF?

[@sisyphus_619]

awesome. let's get more advanced.

[@prettyprinted]

Any suggestions?

[@chinmayeejoshi4592]

A more involved example with something like Google maps maybe?

[@musabomariyeh128]

Thank you for the nice tutorial, i have 2 question, does flask bootstrap support bootstrap version 4.0, the second question is not related to the subject, can i build web apps with flask and react as a front end framework,

[@jasper5016]

Please cover more complicated forms.

[@prettyprinted]

Will do!

[@alexsony1997]

I have a question. I installed flask-bootstrap as you show us in the video but when i run the app, i got the message "no module flask_bootstrap". The flask module is working fine, i didn't have any problem with it. I work on raspberry pi3. Thanks!

[@ISCSchool]

I rather use quickform sometimes, but I have an issue with it.I cannot submit the form correctly because when I add the submit input it finished out of the form tags and don't submit anything.Any help? :S

[@ISCSchool]

Well, I did it. "from wtforms import SubmitField" and then add this to the class form, now the submit button Works fine.:)

[@prettyprinted]

Glad you figured it out.

[@wilhelmwilhelm1251]

Thanks :)

[@patrickwilliams3320]

does Flask nav integrate with flask bootstrap?

[@naheliegend5222]

what is that bootstrap/wtf.html? what does it do and where is it stored?

[@AlessandroSabellico]

I couldn't set the default value for a SelectField nor for a SelectMultipleField using the "default=key/[keys]" field argument (even with static content!).. has something changed with new wtforms versions?

[@prettyprinted]

No, there should be no change. If you want, you can send your code to [e-mail] I can take a look.

[@dannycorganrg1]

i'm getting an error TemplateNotFound: bootstrap/base.html, but the code is as yours, as far as i can tell, any ideas

[@mirzaumair1777]

it is showing me errors in black color. how to change its error color.

[@llamasarus1]

How do I pass data to the value attribute in the form through WTForms with Bootstrap so I could update posts? I tried this: {{ wtf.form_field(form.title, value="{{ post.title }}") } ........but the value didn't interpret it as data from the database. Also how would I put a value inside the textarea?

[@prettyprinted]

Try this: stackoverflow.com/questions/5117479/wtforms-how-to-prepopulate-a-textarea-field If it doesn't work for you, I can try it later and give you the answer.

[@brandonemmanuelcardenasgar9307]

how can I set up a background image?

[@prettyprinted]

That's just regular HTML.

[@brandonemmanuelcardenasgar9307]

I am trying but I get GET /img.jpg HTTP/1.1" 404 what i am doing on index.html is {% block content %} {{form.csrf_token }} {{wtf.form_field(form.nombre_form) }} {{wtf.form_field(form.dia_nac_form)}} {{wtf.form_field(form.mes_nac_form)}} {{wtf.form_field(form.dia_ent_form)}} {{wtf.form_field(form.mes_ent_form)}} {% endblock%}

[@prettyprinted]

You have to use the static keyword and place the image in your static directory. Here's an example: flask.pocoo.org/docs/1.0/tutorial/static/

[@SuperGari2]

what does base.html looks like?

[@prettyprinted]

You can download the code from the link in the description.

[@divamlehri9850]

On running the program it shows error "templateNotFound: bootstrap/wtf.html" How to resolve this error?

[@prettyprinted]

Have you installed Flask-Bootstrap? pip install flask-bootstrap

[@divamlehri9850]

Thanks.....solved !! Can you please tell how to integrate any other downloaded bootstrap theme with the program

[@prettyprinted]

It's basically just putting the code into the correct blocks. You'll have to do some conversion for each template to fit the Flask-Bootstrap model. If you don't want to do that, you can leave the templates as they are, and simply load the CSS in the typical way.

[@siddharth9933]

Why do we use wtform validations if the same can be done by HTML itself ? This way the request does not go to server and it will be faster as well

[@prettyprinted]

The user can always modify the form before they send the data. So you do validation in the HTML for user experience and validation on the server for security.

[@bhavingolakiya5224]

ImportError: cannot import name Anyof give me solution for that please

[@prettyprinted]

AnyOf, not Anyof

[@chrisspencer6502]

one this this video leaves out but is very basic the templates are stored in venv >flask-bootstrap > templates

[@dannycorganrg1]

the link to the code is a 404 can you restore the code as I have an error I cant work out without doing a compare many thanks in advance

[@prettyprinted]

I've updated the link. github.com/PrettyPrinted/youtube_video_code/tree/master/2017/01/17/Using%20Flask-WTForms%20With%20Flask-Bootstrap

[@divamlehri9850]

How to solve :jinja2.exceptions.UndefinedError UndefinedError: 'bootstrap_is_hidden_field' is undefined This "bootstrap_is_hidden_field" is present in the code of wtf.html...I guess some changes have to be made there

[@prettyprinted]

More code is needed for me to know. If you want, you can show me through email. [e-mail]

[@NixBiks]

Was this ever answered? I get the same error

[@taektiek526]

first