librelist archives

« back to archive

Upload file without leaving page

Upload file without leaving page

From:
Norbert Markowicz
Date:
2013-05-21 @ 03:26
Hi guys,

I want to give the end user the ability to upload a file onto the server in
an ajax like fashion where the page does not get reloaded. How can I modify
the code below to do this?

Thanks

@app.route('/upload', methods=['GET', 'POST'])****

def upload():****

    if request.method == 'POST':****

        file = request.files['file']****

        if file and allowed_file(file.filename):****

            filename = secure_filename(file.filename)****

            file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))**
**

    return render_template('index.html')****

** **

** **

    <form action="{{ url_for('upload') }}" method=post
enctype=multipart/form-data>****

      <p><input type=file name=file>****

         <input type=submit value=Upload>****

    </form>

Re: [flask] Upload file without leaving page

From:
Owein Reese
Date:
2013-05-21 @ 03:31
Have it return Json using jsonify with some meta information about the file
upload. Don't send back a new template and don't do a non-ajax POST on the
front end. I suggest checking out jquery.form or one of the drag'n'drop
file uploading libraries on github.
On May 20, 2013 11:27 PM, "Norbert Markowicz" <norbert.markowicz@gmail.com>
wrote:

> Hi guys,
>
> I want to give the end user the ability to upload a file onto the server
> in an ajax like fashion where the page does not get reloaded. How can I
> modify the code below to do this?
>
> Thanks
>
> @app.route('/upload', methods=['GET', 'POST'])****
>
> def upload():****
>
>     if request.method == 'POST':****
>
>         file = request.files['file']****
>
>         if file and allowed_file(file.filename):****
>
>             filename = secure_filename(file.filename)****
>
>             file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
> ****
>
>     return render_template('index.html')****
>
> ** **
>
> ** **
>
>     <form action="{{ url_for('upload') }}" method=post
> enctype=multipart/form-data>****
>
>       <p><input type=file name=file>****
>
>          <input type=submit value=Upload>****
>
>     </form>
>

Re: [flask] Upload file without leaving page

From:
Shawn Milochik
Date:
2013-05-21 @ 03:32
A file can not be uploaded using AJAX. There are workarounds, such as using
iframes. If you do a little Google searching you'll see the common methods.
There's nothing in the Flask framework (or Django, or any other) that can
get around that limitation.

Re: [flask] Upload file without leaving page

From:
Klinkin
Date:
2013-05-21 @ 07:07
Use html5 file api, 
Demo http://html5demos.com/file-api

Отправлено с iPhone

21.05.2013, в 7:32, Shawn Milochik <shawn@milochik.com> написал(а):

> A file can not be uploaded using AJAX. There are workarounds, such as 
using iframes. If you do a little Google searching you'll see the common 
methods. There's nothing in the Flask framework (or Django, or any other) 
that can get around that limitation.

Re: [flask] Upload file without leaving page

From:
David | StyleFlare
Date:
2013-05-21 @ 03:30
You dont you use ajax to send to that URL.

You should google for jquery upload scripts, they work with that code.

You may want to return something other than render template as that will 
be the response to your ajax request.




On 5/20/13 11:26 PM, Norbert Markowicz wrote:
> Hi guys,
>
> I want to give the end user the ability to upload a file onto the 
> server in an ajax like fashion where the page does not get reloaded. 
> How can I modify the code below to do this?
>
> Thanks
>
> @app.route('/upload', methods=['GET', 'POST'])
>
> def upload():
>
>     if request.method == 'POST':
>
>         file = request.files['file']
>
>         if file and allowed_file(file.filename):
>
>             filename = secure_filename(file.filename)
>
> file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
>
>     return render_template('index.html')
>
>     <form action="{{ url_for('upload') }}" method=post 
> enctype=multipart/form-data>
>
>       <p><input type=file name=file>
>
>          <input type=submit value=Upload>
>
>     </form>
>