I was looking for a clear answer how to perform communication between front to back-end for a long time. And after that I found this tutorial, which is clear and understandable for me as a beginner. Julian Nash - thanks a lot. It gives me a milestone in my first programming project.
Best Python Flask Jinja Tutorial available on UA-cam !!! He has explained each and every thing properly. That's exactly I was looking for... *Amazing* ....Thanks a ton Julian!!!
It hit right the thing I want. Love your video, great content with an example from the server side. I had been struggling with all the documentation which has nothing on the server-side, and I cant understand how and where to send the fetch url, but your video saves me. So thump up for ya !
Gah! This video got me. Didn't see (in the previous video) about adding a {% block script %}{% blockend %} in the public_template.html so it took ages to get working. Still, enjoying the series so far.
At its basics, it's just a way to perform API POST, GET..., directly from vanilla JS inside the DOM, then you're just communicating with your python backend as normal. For some reason that was confusing at the start.
*Need HELP* As per this tutorial I'm sending data with POST request using fetch(); in my views.py file I'm able to print it in the console. But when I pass it using render_template() to a html file, the table rows which I expect to update are NOT updating.
How to hide this script from the client side, or can I make a post of these values and sent to the back end to do some stuff in a python program (back-ended)
i m getting an error : Fetch error: TypeError: Failed to fetch any idea? how could the example work : response.json().then(function (data) response.json() object doesnt have any methode call then and it s note a promise
good explanation but I really want to click and move another route by rendering a template, so far I am in the route but since is not JSON and instead is
If you use Token CSRF, I recommend putting this on the headers "X-CSRF-TOKEN": csrf Si utiliza Token Csrf, recomiendo poner esto en las cabeceras "X-CSRF-TOKEN": csrf Example/Ejemplo: csrf = 'Your token' headers: new Headers({ "Content-Type": "application/json", "X-CSRF-TOKEN": csrf })
Hi! I'm getting this error in the console guestbook:72 Uncaught ReferenceError: submit_entry is not defined at HTMLButtonElement.onclick (guestbook:72). Could you help please?
What would be the reason to use Fetch API, instead of form data as in Pt 7? (Or maybe requests if that is possible?) Thanks! I like your videos a lot, very explanatory! I also watched the series of Corey Shafer on Flask (which I liked BTW), but yours are more instructive and clearer so far. You use less additional libraries, which let it be more Pythonic.
The advantage of async/fetch/asyncio is that it is non-blocking. Other parts of your code can still be executed when awaiting. Some applications I found fetch to be useful for include polling and checking form content prior to submitting. Checking form content: What you may want to do is to check that the form content is correct before it is actually submitted. For example, if your user can input a file with only certain type(s) of extension(s), you will want to check if the provided file extension is correct before submitting to the server. If it is not, you give feedback to the user. In JS preventDefault() can be used for this, followed by fetch() after having made sure the form data is correct. A double check on the server side should be done as well (in the file extension example you could use Python's assert keyword) Polling: If you're doing some computationally expensive task in the background, you may want to use fetch to want to periodically check when the task is completed. You could use Celery to offload an expensive task, and use fetch to poll the server every couple of seconds to check if the task is completed. If you don't do this, your request will time out after a minute or so
hello julian , really i need you help please , can we use the datatime with flask ? can we use the datatime with flask ? if yes , please how if we limted two date , means date of start and date of end ? :) :)
@@juliannash3590 good evening , :) I have a file contains two columns the first column contains the values (I have 1 and -1) the second column the date and I have to computer the number of 1 and -1 from a date start and date end. u can help me ?
If anyone is having this trouble, for me it was because the script block was not being loaded as i was missing {% block script %}{% endblock %} in the template.
Thanks for the video! A question about ${window.origin}. What programming language is that? It does not seem to work for me, I use the below instead. fetch(window.location.href+'getjson',{ Do you know if there is any difference?
It's JavaScript and a more modern feature called string interpolation by Template Literals. ${variable} inside backticks will be read out, computed, and put into the resulting string, Example: const name = "yichuan"; console.log(`My name is ${name}`); // Prints "My name is yichuan". See developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals You are using "old style" string concatination syntax.
Videos and explanation are great, but I feel like the videos go from "Flask Tutorial" to "HTML tutorial". I fully get that they are related, but I would be happier I you mainly talked about the basics and main concepts of flask without going into coding of HTML.
![How to POST request in a Python Website using AJAX ? [Flask & Django]](http://i.ytimg.com/vi/UmC26YXExJ4/mqdefault.jpg)
I was looking for a clear answer how to perform communication between front to back-end for a long time. And after that I found this tutorial, which is clear and understandable for me as a beginner. Julian Nash - thanks a lot. It gives me a milestone in my first programming project.
you have NO IDEA, how MUCH OF A HEADACHE YOU SAVED ME. OH MY GOODNESS. THANK YOU
I just completed my project seeing your video. Great help.
Best Python Flask Jinja Tutorial available on UA-cam !!! He has explained each and every thing properly.
That's exactly I was looking for... *Amazing* ....Thanks a ton Julian!!!
Amazed by all the talents Charlie Cox have.
Thanks pal, very useful tutorial, greetings from South America. Greetings fro the flask community.
Thank you soo much for taking your time to do this. I dunno if u hear this a lot but ur special.
vids are class mate, wish i found them earlier!
Thank you very very very very very.....much.
You saved project.
Thank you again.
You really helped me solve a big problem. Bless you
Thanks for great tutorial, really helped me with my project!
Hello Julian, thank you for the help. I was hoping to view the json data in the terminal on the web page, what video is that in?
Do you have this code up anywhere? It's a bit inconvenient to have to scrub through the video to find bits that I'm referencing in my own application.
Bro you just saved my day! Thanks a ton!
Excellent stuff man. Thank you so much.
Excellent resource, thank you very much. :)
Very Helpful, thAnks to you 👍👍👍
Love your work manze.
You're an amazing teacher mate, well done!
It hit right the thing I want. Love your video, great content with an example from the server side. I had been struggling with all the documentation which has nothing on the server-side, and I cant understand how and where to send the fetch url, but your video saves me. So thump up for ya !
Hey Julian, thanks for the great video! Could you please explain how to actually return the response? i always get "Undefined"
very helpful....I'll check out some more of your videos....I did spend some time running down my typos..nothing new there
Tip: Always show code link at the end of the video.
Gah! This video got me. Didn't see (in the previous video) about adding a {% block script %}{% blockend %} in the public_template.html so it took ages to get working. Still, enjoying the series so far.
is it possible to send octet-stream inside the json along with other types of data?
At its basics, it's just a way to perform API POST, GET..., directly from vanilla JS inside the DOM, then you're just communicating with your python backend as normal. For some reason that was confusing at the start.
Thanks for this amazing tutorial!
Is there a reason an else statement is not included in the .then method?
is it possible to send data from flask back to javscript without using jinja?
*Need HELP* As per this tutorial I'm sending data with POST request using fetch();
in my views.py file I'm able to print it in the console. But when I pass it using render_template() to a html file, the table rows which I expect to update are NOT updating.
How to hide this script from the client side, or can I make a post of these values and sent to the back end to do some stuff in a python program (back-ended)
This guy saved me !!! Thank A Lot !!!
why use fetch() and not Ajax get or post to retrieve and send data back to server?
Thanks, for making this Video Julian :)
Awesome stuff man, this helped me a lot!
Great tutorial. Thanks!
i m getting an error : Fetch error: TypeError: Failed to fetch
any idea?
how could the example work :
response.json().then(function (data)
response.json() object doesnt have any methode call then and it s note a promise
why use this and not a request.args or request.form or something like that?
very useful video.. few things need to be updated in the code to make it work error-free
good explanation but I really want to click and move another route by rendering a template, so far I am in the route but since is not JSON and instead is
Amazing, thank you!
Thanks for your help mate! Last few days was wrapping my mind around this topic, and just clicked while watching this video.
If you use Token CSRF, I recommend putting this on the headers "X-CSRF-TOKEN": csrf
Si utiliza Token Csrf, recomiendo poner esto en las cabeceras "X-CSRF-TOKEN": csrf
Example/Ejemplo:
csrf = 'Your token'
headers: new Headers({
"Content-Type": "application/json",
"X-CSRF-TOKEN": csrf
})
Hi! I'm getting this error in the console guestbook:72 Uncaught ReferenceError: submit_entry is not defined
at HTMLButtonElement.onclick (guestbook:72). Could you help please?
oh nevermind the question. I figured it out. Thanks for this tutorial! Very helpful
@@m3wt518 how did you figure it out? I'm stuck with that issue. Thanks.
@@m3wt518 Nevermind. I´ve already fixed it. :D
Saved my day ..
Helpful, next time will be very good if we will meke a zoom that permits to read you code watching the video from a smart phone
What would be the reason to use Fetch API, instead of form data as in Pt 7? (Or maybe requests if that is possible?)
Thanks! I like your videos a lot, very explanatory!
I also watched the series of Corey Shafer on Flask (which I liked BTW), but yours are more instructive and clearer so far. You use less additional libraries, which let it be more Pythonic.
The advantage of async/fetch/asyncio is that it is non-blocking. Other parts of your code can still be executed when awaiting. Some applications I found fetch to be useful for include polling and checking form content prior to submitting.
Checking form content:
What you may want to do is to check that the form content is correct before it is actually submitted. For example, if your user can input a file with only certain type(s) of extension(s), you will want to check if the provided file extension is correct before submitting to the server. If it is not, you give feedback to the user. In JS preventDefault() can be used for this, followed by fetch() after having made sure the form data is correct. A double check on the server side should be done as well (in the file extension example you could use Python's assert keyword)
Polling:
If you're doing some computationally expensive task in the background, you may want to use fetch to want to periodically check when the task is completed. You could use Celery to offload an expensive task, and use fetch to poll the server every couple of seconds to check if the task is completed. If you don't do this, your request will time out after a minute or so
Thank you very much
hello julian , really i need you help please , can we use the datatime with flask ?
can we use the datatime with flask ?
if yes , please how if we limted two date , means date of start and date of end ?
:) :)
Of course, you can use any Python library with Flask, including datetime.
Can you explain more about what you're trying to do?
@@juliannash3590 good evening , :)
I have a file contains two columns the first column contains the values (I have 1 and -1) the second column the date and I have to computer the number of 1 and -1 from a date start and date end.
u can help me ?
Yes you can use datetime module for that
The best!!
Flask forms would work better in this case I believe
awesome video buddy, keep it up ;)
thank you merry much!
Getting an error: ReferenceError: submit_entry is not defined
If anyone is having this trouble, for me it was because the script block was not being loaded as i was missing {% block script %}{% endblock %} in the template.
thanks, helpfull example!.
Thanks for the video!
A question about ${window.origin}. What programming language is that?
It does not seem to work for me, I use the below instead.
fetch(window.location.href+'getjson',{
Do you know if there is any difference?
It's JavaScript and a more modern feature called string interpolation by Template Literals. ${variable} inside backticks will be read out, computed, and put into the resulting string, Example: const name = "yichuan"; console.log(`My name is ${name}`); // Prints "My name is yichuan". See developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
You are using "old style" string concatination syntax.
Thanks you saved my ass
coooolll
this was really fun, shame your channel's dead
Videos and explanation are great, but I feel like the videos go from "Flask Tutorial" to "HTML tutorial". I fully get that they are related, but I would be happier I you mainly talked about the basics and main concepts of flask without going into coding of HTML.
This is great content. Thank you!