相关疑难解决方法(0)

我打算使用jQuery上传一个文件数组.

这个意图包含在一个名为的函数中uploadFilesUsingAjax();

var uploadFilesPromise = uploadFilesUsingAjax();

$.when(uploadFilesPromise).done(function (uploadFilesAjaxResult) {
        // redirect to success page...

在做其他事情之前,我需要等待所有文件成功上传.

里面uploadFilesUsingAjax(),

我这样写了我的代码

function uploadFilesUsingAjax() {
    var files = pages; // pages is a global variable which is an array of files
    var url = "/users/" + currentUser.id + "/files.json";
    var type = "POST";

    console.info('files length:' + files.length);
    if (files.length > 0) {

        var promises=[];
        for (var i = 0; i < files.length; i++) {
            var data = new FormData();
            var postData …

我有一个小的表格，我想将文件上传到CF服务器。过去，我可以通过传统的操作页面提交CFFORM来完成此工作。但是我想使用AJAX上传文件。

我在处理页面上收到如下错误：cffile action =“ upload”要求表单使用enctype =“ multipart / form-data”，即使我已经这样定义了表单。

从google'ng到周围，我认为可能是因为Cffile要求filefield属性，但是由于没有表单对象传递给coldfusion。可能类似的问题。我不太喜欢这个解决方案。

无论如何，我可以解决这个错误吗？

这是我的AJAX：

<!---Script to upload file link --->     
<cfoutput>
<script>
$(function(){
//Add a new note to a link
$("##upload-file").submit(function(event){
   // prevent native form submission here
   event.preventDefault();
        $.ajax({
            type: "POST",
            data: $('##upload-file').serialize(),
            url: "actionpages/file_upload_action.cfm",
            beforeSend: function(){
                $('.loader').show();
            },
            complete: function(){
                 $('.loader').hide(3000);
            },
            success: function() {
                PopulateFileUploadDiv();
                $("##upload").val('');
                $("##response").append( "File successfully Uploaded." );
              }    
        });
        return false;           
    });
});
</script>
</cfoutput>

我的表格：

<form method="post" name="upload-file" id="upload-file" enctype="multipart/form-data">

      <input tabindex="0" size="50" …

当尝试使用 AJAX 上传图像而不直接提交表单并将 FormData 对象发送到服务器时，它会返回空$_FILES数组。<input type="submit">但是，如果我使用标记数组提交表单$_FILES不为空并接收数据。

超文本标记语言

<form action="core/update.php" method="post" enctype="multipart/form-data" id="profile-photo" name="profile-photo-form">
  <input type="file" id="photo-filename" name="avatar" class="edit-show panel photo-upload">
</form>
<button class="save-button" disabled="disabled">Save</button>

JS

$('#profile-photo').on('submit', function(e) {
    e.preventDefault();

    var form = $('#profile-photo')[0];
    var formData = new FormData(form);

    formData.append('avatar', $('#photo-filename')[0].files[0]);

    $.ajax({
      url: "core/update.php", 
      data: formData,
      type: "POST", 
      contentType: false,       
      cache: false,             
      processData: false
    });

    console.log(formData);
});

$('.save-button').on('click', function() {
    if ($('#photo-filename').val != '') {
        $('#profile-photo').submit();
    };
}

UPD

还$('#profile-photo').serialize()返回空白字符串。

更新2

它会与页面上的其他 AJAX …

我在Django Rest Framework中有一个API端点可以上传图像。您能发现我做错了什么吗？

＃models.py

class test(models.Model):
    ...
    upload_path = 'upload/'
    image = models.ImageField(upload_to=upload_path, null=True, blank=True)
    ...

＃serializers.py

class TestSerializer(serializers.ModelSerializer):
    image = serializers.ImageField(
        max_length=None, use_url=True,
    )
    class Meta:
        model = test
        fields = ('id','name','image',...)

＃views.py

@api_view(['GET', 'POST'])
def test_list(request, site_id, block_id):

            ....

        if request.method == 'POST':
            serializer = TestSerializer(data=request.DATA)
            if serializer.is_valid():
                serializer.save()
                return Response(serializer.data, status=status.HTTP_201_CREATED)
            else:
                return Response(
                    serializer.errors, status=status.HTTP_400_BAD_REQUEST)
    else :
        return Response(status=status.HTTP_403_FORBIDDEN)

#js

function setimage() {
    var $input = $("#js_teaser_img");
    var fd = new FormData;

    fd.append('image', $input.prop('files')[0]);

    $.ajax({
        url: …

有一个form。它具有用于上传的字段file。我submit将此表格发送给ajax请求，post方法的服务器。

var frm = $('#contact_form');
frm.submit(function (e) {
    e.preventDefault();
    var data = new FormData()
    data.append('file', $('#id_file')[0].files[0]);
    $.ajax({
        beforeSend: function(jqXHR, settings) {
            jqXHR.setRequestHeader('X-CSRFToken', $('input[name=csrfmiddlewaretoken]').val());
        },
        type: frm.attr('method'),
        method: 'POST',
        url: '',
        data: data,
        cache: false,
        contentType: false,
        processData: false,
        success: function(data) {
            console.log(data)
        }
    });
    return false;
});

我正在使用formdata。我看client-有数据。但是它们不会到达服务器（request.POST={}）。可能是什么原因？

def post(self, request, *args, **kwargs):
    print(request.GET, request.FILES, request.POST)
    contact_form = ContactFormForm(request.POST, request.FILES)
    if contact_form.is_valid():
        contact_form = …

我需要使用ajax在服务器上上传照片.我也设置了javascript的表单,但FormData对象总是空的!我尝试了各种方法来引用实际的表单,但仍然无法正常工作.

小提琴示例:https: //jsfiddle.net/cjngvg8a/

谢谢!

HTML:

<form id="profileImageForm" action="update.php" method="post" enctype="multipart/form-data">
<input type="text" value="hello" name="test" />
<input type="file" name="profile_pic" id="image_upload"/>
<input type="submit" value="Save"/>
</form>

JS:

$('#profileImageForm').on('submit',(function(e) {
    e.preventDefault();     
    var formData = new FormData(this);

    console.log(formData);

    $.ajax({
        type:'POST',
        url: $(this).attr('action'),
        data:formData,
        cache:false,
        contentType: false,
        processData: false,
        success:function(data){
            console.log("success");
            console.log(data);
        }
    });
}));

我正在尝试使用 jquery ajax 发送附加到 FormData 的文件。在参考了一些 mozilla 和 IBM 的文档后，我想出了以下内容。

阿贾克斯代码：

var sessionId = $.cookie("referenceId");
var myFormData = { sessionId: sessionId,
                    cipherData: cipherData,   // Encrypted xml data
                    payslip: document.getElementById('payslip').files[0]};
var formData = new FormData();
for (var key in myFormData) {
    console.log(key, myFormData[key]);
    formData.append(key, myFormData[key]);
}
$.ajax({
    url : 'api/rootpath/childpath',
    type : 'POST',
    processData: false,
    contentType: false,    // Here the contentType is set to false, so what should I put at @Consumes in java code
    data : {
        formData: formData
    }, …

我想在yii2框架中使用Ajax上传文件这是我的代码,但是在控制器"get Instance"中因为序列化数据而返回null; 我怎样才能做到这一点？

这是我的控制器:

<?php
public function actionUpdate($id)
    {
            $model = Signature::findOne([
                'user_id' => $id,
            ]);
            if ($model->load(Yii::$app->request->post())) {
                $model->file = UploadedFile::getInstance($model, 'file');
                $model->file->saveAs('uploads/signature/' . $model->user_id . '.' . $model->file->extension);
                $model->url = 'uploads/signature/' . $model->user_id . '.' . $model->file->extension;

                if ($model->save()) {
                    echo 1;
                } else {
                    echo 0;
                    echo $model->file;
                }
            } else {
                return $this->renderAjax('update', [
                    'model' => $model,
                ]);
            }
    }
?>

这是我的脚本代码我无法在控制器中获取我的文件,它返回null

<?php $script = <<<JS

$('form#{$model->formName()}').on('beforeSubmit', function(e)
{
    var \$form = $(this);

    $.post(
    \$form.attr("action"),
    \$form.serialize(), …

我有一个很长的表单,其中包含文件附件:

这是我的表单的样子:

表单将提交给此操作:

[HttpPost]
public ActionResult AddReceivingConfirm(DTOreceiving entry,IEnumerable<HttpPostedFileBase> fileUpload)
    {

        return PartialView();
    }

通过ajax调用,它是:

$(document).on('click', 'input[type="submit"].genericSubmit', function () {                    //generic function for ajax submit of ANY FORMS t

        if (!$("form#ValidateForm").valid()) {
                return false;
        };


        var frmData = $('.genericForm').serialize();
        var frmUrl = $('.genericForm').attr('action');
            $.ajax({
              type: 'post',
              url: frmUrl,
              data: frmData,

              success: function (e) {
                 $('#target').html(e);
             }
         });
         return false;
 });

一切都是完美的约束,除了IEnumerable<HttpPostedFileBase>总是导致null,

我的表单的文件部分是这样完成的:

 <tr>
 <td>Attachment #1: </td>
 <td colspan="3">
     <input id="file1" type="file" name="fileUpload" />
 </td>

 </tr>

  <tr>
  <td>Attachment …

我有这个表格：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"> </script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">


<div class='col-sm-6' style="padding-left:0px;" >
    <form action="/main/" method="post" id="my_form" enctype="multipart/form-data">
      {% csrf_token %}
      <br>

      <div> <input type="text" name="description" id="id_description" /> </div>
      <div> <input type="file" name="image" id="id_image" /> </div>


      <button type="submit" disabled style="display: none" aria-hidden="true"></button>
      <input class="btn btn-success" type="submit" name="submit" value="Gem" />
    </form>
</div>

这成功发送了表单并且它在服务器端有效。但是我无法从服务器上的表单访问图像。

<script>
    var frm = $('#my_form');
    frm.submit(function (e) {
        e.preventDefault(e);
        $.ajax({
            async: true,
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
                console.log("success")
            },
            error: function(request, status, error) {
                console.log("error") …