使用 Ajax J 查询将文件路径从视图传递到 MVC 控制器 return null

Question

我正在尝试使用 MVC 5 和 Ajax Jquery（异步）上传图像，但图像变量的值总是 return null，

我已经检查了一些关于这个问题的以前的堆栈溢出帖子，但我找不到我的错误，任何人都可以帮助我，

请帮忙,

型号Class

 public class TravelCategoryCustom
        {
            public int categoryId { get; set; }
            public string categoryName { get; set; }
            public string categoryDescriprion { get; set; }
            public HttpPostedFileBase image { get; set; }
            public int TotalPlaces { get; set; }
        }

查看

<form enctype="multipart/form-data">
                <div class="form-group">
                    <label>Category Name</label>
                    @Html.TextBoxFor(model => model.categoryName, new { @class = "form-control" })

                </div>
                <div class="form-group">
                    <label>Category Description</label>
                    @Html.TextAreaFor(model => model.categoryDescriprion, 5, 1, new { @class = "form-control " })
                </div>
                <div class="form-group">
                    <label>Category Image</label>
                     <input type="file" id="dialog" />
                </div>

                <input type="button" value="Create" id="submtt" class="btn btn-primary" onclick="favfunct()" />

            </form>

脚本

<script>
    function favfunct() {
    $.ajax({
  var formData = new FormData($('form')[0]);
        url: "/MVCTravelCategories/Create",
        dataType: "json",
        type: "POST",
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify({ trvlcategory: { categoryId: '1', categoryName: 'testName', categoryDescriprion: 'TestDec', image: formData , TotalPlaces: '3' } }),
        async: true,
        processData: false,
        cache: false,
        success: function (data) {
            alert(data);
        },
        error: function (xhr) {
            alert('error');
        }
    });
    }
</script>

操作结果（图片） http://ishara119-001-site1.myasp.net/content/Untitled.jpg

Answer 1

感谢所有检查我的问题的人，终于我找到了答案，我将脚本更改为这个并且它有效。

<script>
    var myVariable ;
    var Asd = 'Helslo';

    $("#myImage").change(function () {
        var file = this.files[0];
        fileName = file.name;
        myVariable = file;
        size = file.size;
        type = file.type;
        myVariable = file;
    });


    function favfunct() {
        var formData = new FormData();
        var totalFiles = document.getElementById("dialog").files.length;
        for (var i = 0; i < totalFiles; i++) {
            var file = document.getElementById("dialog").files[i];

            formData.append("dialog", file);
        }

    $.ajax({

        url: "/MVCTravelCategories/Create",
        dataType: "json",
        type: "POST",
        enctype: "multipart/form-data",
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify({ trvlcategory: { categoryId: '1', categoryName: 'TestName', categoryDescriprion: 'TestDes', image: myVariable, TotalPlaces: '3' } }),
        async: true,
        processData: false,
        cache: false,
        success: function (data) {
            alert(data);
        },
        error: function (xhr) {
            alert(Asd.toString());
            alert('error');
        }
    });
    }
</script>

使用 Ajax J 查询将文件路径从视图传递到 MVC 控制器 return null

Passing File path to MVC controller from View with Ajax J query return null

jquery

asp.net-ajax

jquery-file-upload

jsajaxfileuploader