单击链接时显示部分视图

时间:2011-05-13 10:41:53

标签: jquery asp.net-mvc ajax

我对JQuery和MVC 2相当陌生,这让我有点困难,我以前总是使用WebForms。
我正在使用NerdDinner示例作为设置(我已经为切换了晚餐)。 我想做的很简单。在表格中,当在表格中点击“详细信息”链接时,我想要一个带有详细信息的小模式显示 现在,当我点击链接时,我在新窗口中打开“Details.ascx”,它不会将其添加到详细信息div

搜索页面(查看)

表中的链接:(foreach(模型中的var项))

<%= Ajax.ActionLink("Details", "Details", new { id = item.id}, new AjaxOptions() { UpdateTargetId = "details" })%>  

javascript:

<script type="text/javascript">
    $('tr').click(function() {
        $("#details").load("Persons/Details/1")
    });
</script>

div包含详细信息:

<div id="details" class="detailView">details here</div>

部分观点:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Person>" %>
<%@ Import namespace="RegistryTest.Models" %>
<div id="detailsModal">
    <%= Html.Encode(Model.surname) %>
</div>

控制器

public PartialViewResult Details(int id)
    {
        Person person = repository.GetPerson(id);

        return PartialView("Details", person);
    }

如果您需要有关设置的更多信息,请与我们联系。

2 个答案:

答案 0 :(得分:1)

忽略Ajax助手,它们用于ASP.NET AJAX脚本。

将您的链接更改为:

<%= Html.ActionLink("Details", "Details", new { id = item.id})%> 

你的jQuery:

    $('tr').click(function() {
        var url = jQuery(this).find('a').attr('href');
        $("#details").load(url)
    });

答案 1 :(得分:0)

<强> Page1.asp的

<div class="holder">
    <div>1</div>
    <div class="test">2</div>
</div>
$('。holder')。load('page1.asp .test'); // returns =&gt;&gt; 2 // .test抓取任何带有.test的元素并将其推入持有者

所以页面看起来像这样......

<div class="holder">
    <div class="test">2</div>
</div>