0

我目前有以下代码,它可以对工作正常的控制器进行 ajax 调用。

@Ajax.ActionLink("Add to Wishlist", "Add", "Wishlist", new { productId = Product.ProductId }, new AjaxOptions { UpdateTargetId = "breadcrumbs", InsertionMode = InsertionMode.Replace, HttpMethod = "Post" }, new { @class = "button" })

现在我需要更改此代码并允许用户添加一些额外的数据以及产品 ID。

现在的要求是在单击“添加到愿望清单”链接时打开一个模式弹出窗口,并在模式窗口中显示一个下拉列表和一个文本框,一旦用户填写它们并单击模式弹出窗口中的提交按钮,然后将数据发送到控制器.

现在,我的页面有多个这样的链接,并且所有链接都有不同的 productId。

我的第一个问题如何将产品 ID 发送到模式弹出窗口。

谢谢阿纳布

4

2 回答 2

0

使用Html.ActionLink辅助方法切换到普通链接

@Html.ActionLink("Add to Wishlist", "Add", "Wishlist",
                           new { @id=product.ProductId},new { class="modelLink"})

现在做一些javascript来监听这个链接的点击事件,然后打开对话框并发送你想要的任何参数。下面的代码正在打开一个模型弹出窗口(jQuery UI 对话框(也就是说,您需要包含 jQuery UI 库才能使此代码工作)),它正在向控制器的Add操作方法发送 2 个参数。WishList无论您从 Add action 方法返回什么,都将显示在 Model 对话框中。

$(function(){    
  $('a.modelLink').click(function(){

     var item=$(this);

     var url=item.attr("href")+"&anotherParam=unicorn";

        var dialog = $("#dialog");
        if ($("#dialog").length == 0) {
            dialog = $('<div id="dialog" style="display:hidden"></div>').appendTo('body');
        }
        dialog.load(
            url,
            {}, // omit this param object to issue a GET request instead a POST request, otherwise you may provide post parameters within the object
            function (responseText, textStatus, XMLHttpRequest) {
                dialog.dialog({                       
                    close: function (event, ui) {                            
                        dialog.remove();
                    },
                    modal: true,
                    width: 460
                });
            }
        );
    }); 

});
于 2012-08-10T20:21:01.340 回答
0

在您的主视图中(您从中启动模态的):

TempData["ProdId"] = <your product id>

在您的模态(或弹出)对话框中:

var ProdId = (int)TempData["ProdId"]

希望这可以帮助。

于 2012-08-10T19:08:28.653 回答