0
class PhotoUploadFormHandler(webapp2.RequestHandler):
    def get(self):
#        upload_url = blobstore.create_upload_url('/upload_photo')
    # The method must be "POST" and enctype must be set to "multipart/form-data".
    self.response.out.write('''<html><body>  
    <form id="imgform" action="none" method="POST" enctype="multipart/form-data">
    Name: <input type="text" name="name"/  value="{{ user.name }}" > <br/> 
    Upload File : <input type="file" name="file1"><br> 
    <h7 id="create_upload_url">
    </h7>
    <input type="button"  id="submitbutton"  value="Submit"> 

    </form>
    <div id="output"></div>
    </body>
    <script type="text/javascript" src="js/zepto.js" > </script>
    <script type="text/javascript">

        // $('#submitbutton').submit( function(){
        $('#submitbutton').live("click",function(){
        console.log("submitbutton");
            // $('#upload_file').submit();   
            $('#create_upload_url').load('/create_upload_url', function() {
                var create_upload_url=$('#create_upload_url').text();
                $('#imgform').attr('action', create_upload_url); 
                // We serialize the post form, this grabs all the post values in the form.
                var info = $(this).closest('form').serialize(); 
                console.log(info);
                console.log(create_upload_url);
                $.post(create_upload_url, info, function(data) {
                        // We now pop the output inside the #output DIV.
                        $("#output").html(data);
                    });

              console.log('Load was performed.'+ create_upload_url );return true;

            });
        });
    </script>
    </html>
    ''')

我从一个工作表单开始,其中上传 url 来自应用程序

但是这与后退按钮有问题

然后我尝试使用 ajax 动态获取 url

虽然我确实得到了典型的 url 并重定向 get_uploads 函数现在返回 0

这是正确的方法吗?

4

1 回答 1

1

问题就在这里

var info = $(this).closest('form').serialize(); 

序列化表单数据但不包含文件,因此您成功提交表单,但没有文件上传。

通常您需要发出表单提交来上传文件。你不能用一个简单的 AJAX 帖子来做到这一点。

有一些解决方法涉及创建单独的 iframe 并为 iframe 发出表单提交,这样您的主框架就不会更新。如果你谷歌“jquery ajax 文件上传”,有多种解决方案。

这是一个简单的教程:http ://tutorialzine.com/2013/05/mini-ajax-file-upload-form/

于 2013-05-27T15:06:14.270 回答