Post 从模态局部视图到具有路由前缀属性的不同控制器

Post form from modal partial view to a different controller with a routeprefix attribute

我有一个具有表单的局部视图 - 我从 Home 控制器启动这个局部视图。

@using (Html.BeginForm("CloudContent","Files", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div id="container"></div>
    <input type="submit" name="PostMe" title="Submit" value="Submit Form" /> 
    @Html.HiddenFor(m => m.MyProperty);
    @Html.HiddenFor(m => m.SelectedIds);
}

我想post这个表单到文件控制器,但是文件控制器有一个路由前缀: [RoutePrefix("sth/api/v1/files")]

这导致我的表单操作为空。

它似乎没有被添加到命名路由中,所以我不能使用beginrouteform。另外,我对应用程序影响不大,所以最好在我的表单或部分视图中处理...

我想要 post 到文件控制器中的方法:

[HttpPost]
[Route("getcloudcontent")]
public List<ConnectedFile> CloudContent(CloudFilesModel model)
{
    //do magic
}

更新:

这是另一个包含部分视图/子操作的示例:

HomeController.cs:

using System.Web.Mvc;

public class HomeController : Controller
{
    [Route("~/")]
    public ActionResult Index()
    {
        return View();
    }

    [Route("ModalContent")]
    [ChildActionOnly]
    public ActionResult ModalContent()
    {
        return View();
    }
}

FilesController.cs:

using System.Web.Mvc;

[RoutePrefix("sth/api/v1/files")]
public class FilesController : Controller
{
    [HttpPost]
    [Route("getcloudcontent")]
    public ActionResult CloudContent(string model)
    {
        return Content("test");
    }
}

Views\Home\Index.cshtml:

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
    <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
        Show modal
    </button>

    <div class="modal fade" id="myModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    @Html.Action("ModalContent")
                </div>
            </div>
        </div>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>

Views\Home\ModalContent.cshtml:

@using (Html.BeginForm("CloudContent", "Files", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div id="container"></div>
    <input type="submit" name="PostMe" title="Submit" value="Submit Form" />
}

Global.asax.cs:

using System.Web.Mvc;
using System.Web.Routing;

public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        RouteTable.Routes.MapMvcAttributeRoutes();
    }
}

结果HTML:

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
    <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
        Show modal
    </button>

    <div class="modal fade" id="myModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <form action="/sth/api/v1/files/getcloudcontent" enctype="multipart/form-data" method="post">
                        <div id="container"></div>
                        <input type="submit" name="PostMe" title="Submit" value="Submit Form" />
                    </form>
                </div>
            </div>
        </div>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>

您的代码有一些不同的地方有问题。我 运行 你的代码,它没有任何问题。

代码如下:

FilesController.cs:

using System.Web.Mvc;

namespace Controllers
{
    [RoutePrefix("sth/api/v1/files")]
    public class FilesController : Controller
    {
        [Route("")]
        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        [Route("getcloudcontent")]
        public ActionResult CloudContent(string model)
        {
            return Content("test");
        }
    }
}

Index.cshtml:

@using (Html.BeginForm("CloudContent", "Files", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div id="container"></div>
    <input type="submit" name="PostMe" title="Submit" value="Submit Form" />
}

Global.asax.cs:

using System.Web.Mvc;
using System.Web.Routing;

public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        RouteTable.Routes.MapMvcAttributeRoutes();
    }
}

当我转到 http://localhost/sth/api/v1/files 时,我看到以下内容 HTML:

<!DOCTYPE html>
<html>
<head><title>Test</title></head>
<body>
    <form action="/sth/api/v1/files/getcloudcontent" enctype="multipart/form-data" method="post">    <div id="container"></div>
    <input type="submit" name="PostMe" title="Submit" value="Submit Form" />
</form>
</body>
</html>

请注意,表单操作具有正确的 URL,其中包括前缀。