mvc $('form').submit 不在局部视图上执行答案

【问题标题】：mvc $('form').submit do not execute on partial viewmvc $('form').submit 不在局部视图上执行
【发布时间】：2017-02-20 17:33:55
【问题描述】：

我正在开发一个 MVC 5 应用程序。

我有一个Parent View 调用Partial View 来更改图片。

这是我对部分视图的调用...

$('formPhoto').submit(function(event) {
    event.preventDefault();
    if ($(this).valid()) {
        var formdata = new FormData($(this).get(0));
        $.ajax({
            url: this.action,
            type: this.method,
            data: formdata,
            processData: false,
            contentType: false,
            beforeSend: function() {
                alert(1);
            },
            success: function(result) {
                successPhoto(result);
            },
            complete: function() {
                // alert(3);
                // And so on.
            }
        });
    }
    return false;
});

我的局部视图是这样的

我的表单名为“FormPhoto”。我在 Submit 上定义了一个Ajax 函数，就像这样。

$('formPhoto').submit(function(event) {
    event.preventDefault();
    if ($(this).valid()) {
        var formdata = new FormData($(this).get(0));
        $.ajax({
            url: this.action,
            type: this.method,
            data: formdata,
            processData: false,
            contentType: false,
            beforeSend: function() {
                alert(1);
            },
            success: function(result) {
                successPhoto(result);
            },
            complete: function() {
                // alert(3);
                // And so on.
            }
        });
    }
    return false;
});

这个函数永远不会在提交时执行。

我错过了什么？

另外，我尝试使用获取部分视图数据

var formdata = new FormData($(this).get(0));

但我认为这是不正确的。

有什么想法吗？

塔恩克斯？

【问题讨论】：

永远不要将代码发布为图像。不要将 sn-ps 用于无论如何都不会运行的代码；只需缩进 4 个空格即可显示代码。另外：基本故障排除。将alert()s 放入您的代码中以确保它被完全调用。重新阅读你正在使用的东西的文档（比如 jQuery）。

标签： javascript jquery ajax asp.net-mvc partial-views

【解决方案1】：

你必须使用 jquery id selector:

$('#formPhoto')

改为

$('formPhoto')

另外，我尝试使用 var formdata = new FormData($(this).get(0)); 获取部分视图数据

在这里您创建一个包含form 详细信息的FormData 对象。

var formdata = new FormData($(this)[0]);- 这将在FormData 中自动提交表单元素，您无需手动将数据附加到FormData 变量。

这是一个例子：

$('button').click(function(){
  var formData=new FormData($('#myForm').get(0));
  console.log(formData.get('input1'));
  console.log(formData.get('input2'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myForm">
  <input type="text" value="test" name="input1"/>
  <input type="text2" value="test2" name="input2"/>
  <button type="submit">Save</button>
</form>

【讨论】：