使用javascript在MVC中调用控制器方法

时间:2012-09-01 21:32:35

标签: javascript jquery ajax asp.net-mvc

我试图让一个表格行作为我的mvc网站中另一个视图的链接。我不想使用自动生成的表列表提供的标准“详细信息”链接,而是使用表格行作为“详细信息”视图的链接。所以我需要以某种方式将行作为链接。每个rom都有一个唯一的id,我需要传递给控制器​​方法。我尝试了不同的解决方案,但是当我按下表格行时发生了注意......

到目前为止,这就是我所拥有的:               

<script type="text/javascript">
$(document).ready(function(){
    $('#customers tr').click(function () {
        var id = $(this).attr('id');
        $.ajax({
            url: "Customer/Details" + id,
            succes: function () { }
        });
    })
})
</script>

我的控制器方法:

public ActionResult Details(int id)
{
    Customer model = new Customer();
    model = this.dbEntities.Customers.Where(c => c.Customer_ID == id).Single();
    return View(model);
}

的Global.asax:

public static void RegisterGlobalFilters(GlobalFilterCollection filters)
{
    filters.Add(new HandleErrorAttribute());
}

public static void RegisterRoutes(RouteCollection routes)
{
    routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

    routes.MapRoute(
        "Default", // Route name
        "{controller}/{action}/{id}", // URL with parameters
        new { controller = "Home", action = "Index", id = UrlParameter.Optional }     
    );

    routes.MapRoute(
        "CustomerDetails",
        "Customer/Details/{id}",
        new { controller = "Customer", action = "Details", id = "" }
    );
}

protected void Application_Start()
{
    AreaRegistration.RegisterAllAreas();

    // Use LocalDB for Entity Framework by default
    Database.DefaultConnectionFactory = new SqlConnectionFactory(@"Data Source=(localdb)\v11.0; Integrated Security=True; MultipleActiveResultSets=True");

    RegisterGlobalFilters(GlobalFilters.Filters);
    RegisterRoutes(RouteTable.Routes);
}

5 个答案:

答案 0 :(得分:5)

以下是我要做的事情:

<tr data-id='@SomeRazorDataId' class="MyAction">foo</tr>

然后:

$(document).ready(function(){
    $('.MyAction').live("click",function () {
        var id = $(this).attr('data-id');
        window.location = "Customer/Details/" + id;
    })
});

如果您使用的是jQuery 1.7+,则应使用on()方法而不是live()方法。

祝你好运!

答案 1 :(得分:3)

代码中有错误;

success:
//----^

答案 2 :(得分:2)

有几件事:

  1. 在操作和参数/之间添加斜杠url: "Customer/Details/" + id),否则,您将调用名为Action的{​​{1}}例如,它不存在;
  2. 确保您的Global.asax中已配置路由以支持Details123,即id
  3. 就像@undefined所说的那样,回调的名称是 Customer/Details/{id} ,而不是success
  4. 你的succes应该有以下几点:

    Global.asax

答案 3 :(得分:1)

我最近遇到过这种情况,并选择使用Ajax助手类:

        @Ajax.ActionLink("Details", "Details", 
        new
        {
            id = Model.Id
        }, null)

在这个例子中,它会假设您想要一个说明“详细信息”的链接,并且您已经在客户控制器中。

无论哪种方式,如果您只想从链接触发控制器操作,请查看帮助程序类,在如何传递/处理id值等方面为您提供更强的输入

答案 4 :(得分:0)

您尝试调用的网址无效:

&#34;顾客/细节&#34; + id,

取而代之的是&#34;客户/详情&amp; id =&#34; + id

(OR)

使用&#39;数据&#39;

$。AJAX({                 网址:&#34;客户/详细信息&#34;,                 数据:{ID:ID},                 成功:function(){}             });