Javascript 防止嵌套表单的按钮提交整个表单

我认为：

<form asp-action="Edit">
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
        <input type="hidden" asp-for="Id" />

        <div class="form-group">
            <label asp-for="foto" class="control-label">Afbeelding</label>
            @{
                if (Model.foto == null)
                {
                    <form  asp-controller="Upload" asp-action="SaveFoto" classenctype="multipart/form-data">

                        <div class="form-group row">
                            <div class="custom-file">
                                <input class="form-control custom-file-input" type="file" name="image"/>
                                <label class="custom-file-label">Bladeren....</label>
                                </div>                              
                        </div>
                        <div class="form-group">
                            <button type="submit">OK</button>
                        </div>
                        <img src="@ViewData["Filelocation"]" />
                    </form>
                }
                else
                {
                    <label>er is al een foto</label>
                }
            }
        </div>            
        <div class="form-group">
            <input type="submit" value="Save" class="btn btn-primary" />
        </div>
    </form>

阿弗比尔丁
@{
如果（Model.foto==null）
{
布莱德伦。。。。
好啊
}
其他的
{
呃是艾琳·福托
}
}

我有一个表单来更新整个记录，但有一个嵌套表单来上传照片文件。 如何防止照片文件的按钮发布整个表单

我有这个JS：

<script>
    $(document).ready(function (e) {
        e.preventDefault();
        $(".custom-file-input").on("change",
            function () {
                console.log('processing');
                var filename = $(this).val().split("\\").pop();
                $(this).next(".custom-file-label").html(filename);
            })

    });
</script>   

$（文档）.ready（函数（e）{
e、 预防默认值（）；
$（“.custom file input”）。在（“更改”，
函数（）{
console.log（'processing'）；
var filename=$（this.val（）.split（“\\”）.pop（）；
$（this）.next（“.custom file label”）.html（文件名）；
})
});

控制员：

[HttpPost]
    [ValidateAntiForgeryToken]
    public async Task<IActionResult> SaveFoto(IFormFile image)
    {
        string foto = null;
        if (ModelState.IsValid)
        {
            if (image != null && image.Length > 0)
            {
                var imagepath = @"\images\speelgoed";
                var uploadpath = env.WebRootPath;
                var uniquefilename = Guid.NewGuid().ToString();
                var filename = Path.GetFileName(uniquefilename + '.' + image.FileName.Split('.')[1].ToLower());
                string fullpath = uploadpath + filename;

                imagepath = imagepath + @"\";
                var filepath = @".." + Path.Combine(imagepath, filename);
                using (var filestream = new FileStream(fullpath, FileMode.Create))
                {
                    await image.CopyToAsync(filestream);
                }

                ViewData["Filelocation"] = filepath;
            }

            return View();


        }

        return View();
    }

[HttpPost]
[ValidateAntiForgeryToken]
公共异步任务SaveFoto（文件映像）
{
字符串foto=null；
if（ModelState.IsValid）
{
if（image！=null&&image.Length>0）
{
var imagepath=@“\images\speelgoed”；
var uploadpath=env.WebRootPath；
var uniquefilename=Guid.NewGuid（）.ToString（）；
var filename=Path.GetFileName（uniquefilename+'..+image.filename.Split（'..'）[1].ToLower（））；
字符串完整路径=上传路径+文件名；
imagepath=imagepath+@“\”；
var filepath=@..“+Path.Combine（图像路径，文件名）；
使用（var filestream=newfilestream（fullpath，FileMode.Create））
{
等待image.CopyToAsync（文件流）；
}
ViewData[“Filelocation”]=文件路径；
}
返回视图（）；
}
返回视图（）；
}

此时，我甚至无法调试，因为我在控制器上设置的断点没有命中。。。 有什么建议吗？ 谢谢

---

James

您不能在HTML中使用此功能和结构，因为我们不能将一个表单输入作为另一个表单输入的子表单输入，我们不能使用嵌套表单输入

stackoverflow中的另一个答案是：

---

在内部表单中添加一个onsubmit事件处理程序，并在其中调用

e.preventDefault（）

。