4

我正在做一个项目，另一个开发人员有一些这样的代码......

<script type="text/javascript">
    function submitForm() {
        document.forms[0].submit();
    }
</script>       


@foreach (var product in Model)
{
    using (Html.BeginForm("SelectProduct", "Home", new {productId = product.Id}))
    {
    <tr>
        <td>
            <a href="#" id="submit_form" onclick="submitForm();">@product.Id</a>
        </td>
        <td>
            @product.Name
        </td>
    </tr>
    }
}

它构建了一个包含可点击产品 ID 和产品名称的 2 列表。单击 productId 时，它会发布到主控制器上的 SelectProduct 操作

[HttpPost]
public ActionResult SelectProduct(Guid productId)
{
   ...
}

我喜欢这个，因为它是一个 POST 并且不会在 url\querystring 中发送 productId。（我改变了这个例子的代码，这些arnt真的productIds和id更喜欢在url中没有这个数据）

但我不喜欢这个，因为...

  • 它不起作用，因为它总是发布表单 [0]
  • 不知道我喜欢它如何为每个产品创建一个表格
  • 它弄乱了我正在处理的jquery mobile listview，格式很奇怪。我不完全确定为什么，但认为是因为形式。

相比之下，我有一个带有锚标签的以下列表视图，并且呈现得很好。

<ul data-role="listview" data-inset="true" data-dividertheme="b">
    <li><a href="@Url.Action("Index", "SomeControllerA")">Some Controller A</a> </li>
    <li><a href="@Url.Action("Index", "SomeControllerB")">Some Controller B</a> </li>
    <li><a href="@Url.Action("Index", "SomeControllerC")">Some Controller C</a> </li>
</ul>

所以我的问题是...

如何在不使用单独的重复表单的情况下制作具有相同功能的类似表格/产品列表（即单击 productID 并 POST 到传递 productId 但不在查询字符串中的控制器操作）？

我在想可能只是一种形式，但以某种方式正确的 productID 被传递给控制器​​。这样我就可以在@foreach (var product in Model)之外拥有Html.BeginForm。

我想我正在尝试做一些类似于 LinkBut​​ton 曾经在网格中做的事情。这就像我想要 ActionLinks 但我希望他们发布而不是 GET。

感谢任何帮助。

谢谢！

4

2 回答 2

1

您的代码 a 有许多错误点。我建议使用 ajax 的替代方法

1.使用foreach，您可以在一个页面中制作多个表单。并且在提交时您正在提交第一个表单（document.forms[0].submit()）。独自的

重写你的html如下

@foreach (var product in Model)
{

<tr>
    <td>
        <a href="#" id="submit_form" onclick="submitForm(@product.Id);"></a>
    </td>
    <td>
        @product.Name
    </td>
</tr>

}

并使用 jquery 对服务器进行 ajax 调用。

var productid;
        function submitForm(productid) {

        $.ajax({
            type: 'GET',
            url: "/Home/SelectProduct?productId="+productid,

            contentType: "application/json; charset=utf-8",
            success: function (_results) {
               $("#resultdiv").html(_results);
            },
            error: function (_results) {
            }
        });
    }

并接受 productid 作为查询字符串

var ProductId=HttpContext.Request.QueryString["productId"]

2.Still 如果您采用相同的方法......您期望查询字符串作为操作方法中的参数。这是错的

你可以这样接受。（在以下代码段using (Html.BeginForm("SelectProduct", "Home", new {productId = product.Id}))中，您添加的 productId 属性可以被接受为服务器端方法中的查询字符串。）

var ProductId=HttpContext.Request.QueryString["productId"]
于 2012-10-05T08:41:07.273 回答
0

你不能用普通链接（带<a>标签）来做Ajax.ActionLink()。改用方法。文档

例子：

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

@Ajax.ActionLink("Click this link", "SelectProduct","Home", new { productId = product.Id }, new AjaxOptions { UpdateTargetId = "DivToUpdateWithResult", HttpMethod = "POST" ,OnComplete = "js_function_to_call_afterComplete();" })
于 2012-10-05T04:04:31.623 回答