从局部视图MVC jQuery的用户界面工具提示(jquery Ui tooltip from pa

我想知道是否有可能有一个提示的局部视图显示。 我试图设计出拥有一批学生的页面，当我将鼠标悬停在一个学生的一些细节似乎他们，他们的臣民和其他一些细节的清单。 我知道我可以把项目的冠军，但我不能让我从那里需要的所有信息，以及我的个人资料查看了我需要的信息。 提前致谢

这里是我当前的代码

IEnumerable<StudentApp.Models.Student>

@foreach (var item in Model)
{  <div class="col-md-2 col-sm-4">

           <img  title="@item.Name, @item.StudentNo " class="img img-responsive" src="@item.StudentPic" />

</div>

}

    @section scripts
{
  <script type="text/javascript">
      $(document).ready(function () {
          $(document).tooltip();
      });
   </script>
}

这里是我的详细信息视图

  <div class="display-label">
     @Html.DisplayNameFor(model => model.Name)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.Name)
</div>


<div class="display-label">
     @Html.DisplayNameFor(model => model.StudentNo)
</div>
<div class="display-field">
    @Html.DisplayFor(model => model.StudentNo)
</div>

@foreach (var item in Model.Students)
{
   <li>@item.Course</li>
}

Answer 1:

您可以使用的content选项做出任何你需要他们的工具提示的内容。 MVC的代码可以在任何地方你的页面放置，只要你可以使用jQuery来抓住它（例如在。 noscript标签或类似）：

$(document).tooltip({
    items: ".myTooltipClass",
    content: function() {
        // .text() will unescape any contained HTML and render it properly;
        // use .html() if your content doesn't contain additional HTML
        return $("noscript#myMvcContent").text();
    }
});

这里有一个小提琴演示： http://jsfiddle.net/guke50uw/

您也可以使用$(this)里面content功能，可以利用与HTML数据属性返回不同的项目不同的提示; 取决于你的页面是如何构成的。

Answer 2:

我会用工具提示的开放式方法，并设定通过AJAX工具提示对象存在的内容：

$(document).ready(function () {
    $(document).tooltip({ open: function(event, ui) {
        $(ui.content).load("[url for returning view contents]");
    }
});

您可能需要使用工具提示的实例属性或可能通过开放功能的UI参数检索你的学号或其他标识来正确地查询你的部分观点，但是这应该有助于让你去。

文章来源: jquery Ui tooltip from partial view mvc