获取Ajax错误“xxx”未定义

时间:2016-04-04 12:19:44

标签: javascript jquery ajax

我查看过很多Stackoverflow问题,各种教程和youtube vids,到目前为止还没有(我找到的)为我解决这个问题......

我有一个表单来加载单个文件。它在没有ajax的情况下提交此罚款。

    <form asp-action="FileIndexView"
          asp-controller="SuburbsAndPostcodesAdmin"
          method="post"
          enctype="multipart/form-data">
        <div class="form-horizontal">
            <div class="form-group">
                <label class="col-md-4 control-label">Select the Suburbs and Postcodes latest CSV File:</label>
                <input type="file"
                       name="CSVFile"
                       id="txtFileUpload"
                       class="col-md-8 control-label" />
            </div>
            <div class="form-group">
                <input type="submit"
                       name="Submit"
                       value="Submit"
                       class="col-md-1 btn btn-primary"
                       disabled="disabled"
                       id="SubmitFile" />
            </div>
        </div>

我有一个Ajax POST方法。单击提交按钮时调用它。一切都好。

这是代码。

        $('#SubmitFile').click(function (e) {
        e.preventDefault(); // <------------------ stop default behaviour of button

        //var fileUpload = input.files[0];
        var url = "/SuburbsAndPostcodesAdmin/test";
        var connId = $.connection.hub.id;
        var fd = new FormData();
        fd.append('File', input.files[0]);
        fd.append('connId', connId);

        $.ajax({
            type: "POST",
            url: url,
            data: fd,
            processData: false,
            contentType: false,

        });

当我单步执行此操作时,错误在:

“fd.append('File',input.files [0]);”

在控制台中出现以下错误。

  ReferenceError: input is not defined
  <anonymous>
   FileIndexView:127
  n.event.dispatch()
   jquery.min.js:3
  n.event.add/r.handle()
   jquery.min.js:3
  EventLoop.prototype.enter()
   ...

为什么这行错误?

它应如何读取以便定义?

文件名应该是什么?为什么? (这需要回到表格中)

2 个答案:

答案 0 :(得分:1)

问题在于input.files[0],因为此处input 未定义

而不是

fd.append('File', input.files[0]); //here input is not defined

尝试

fd.append('File', $("#txtFileUpload")[0].files[0]);

答案 1 :(得分:-1)

这个“Formdata”对象似乎很可疑。 jQuery喜欢简单的对象,即

$.ajax({
        type: "POST",
        url: url,
        data: {input: "A", somethingelse: 2, somethingmore: true},
        processData: false,
        contentType: false,

   });

在浏览器中,使用开发人员选项并转到“网络”选项卡,以确切了解在POST操作中推送到服务器的内容。我敢打赌它不符合你的服务器方法所期望的,因此是例外。

<强> 修改

直到现在才注意到您正在尝试进行文件上传。它通过AJAX被证明是一种痛苦的屁股。我使用名为DropZone的插件取得了成功。 http://www.dropzonejs.com/