在加载标签jQueryUI的选择ASP.NET MVC局部视图 [英] Load ASP.NET MVC partial view on JQueryUI tab selection

问题描述

我一直在寻找的最后一天，无法找到在过去的一两年之内问这个特定主题的东西，并在jQuery出现脱precate的东西相当多，似乎可以公平地问这个问题对于当前的JQuery API

I've been searching for the last day and can't find anything on this specific topic asked within the last year or two, and as JQuery appears to deprecate things quite a lot, it seems fair to ask this question with regard to the current JQuery API.

有点新的JQuery的，我想知道这一点;

Bit new to JQuery, I'd like to know this;

如果我有一个团队的每一个成员选项卡，并为每个数据表从数据库的局部视图加载这些标签，当我加载初始页面将所有选项卡来与他们谐音填充还是会被点击的标签时，他们只被填充？

If I have a tab for every member of a team, and for each of those tabs a table of data is loaded in a partial view from a database, when I load the initial page will all the tabs be populated with their partials or will they only be populated when the tab is clicked?

如果标签填充在页面加载时，是有办法让这个当点击标签唯一填充？我可以提供源$ C ​​$ C，如果有任何一点在这样做，只是发表意见，并提出要求。

If the tabs are populated on page load, is there a way to make it so that the tabs only populate when clicked? I can provide the source code if there's any point in doing so, just comment and ask for it.

修改1

由于我使用ASP.NET MVC呈现与上下文信息的部分意见，就是它的字面只是AJAX /，也就是在href重要或不将href需要链接到静态内容？问问候：

As I'm using ASP.NET MVC to render the partial views with contextual information, is it literally just the "ajax/" that is important in the href or does the href need to link to static content? Question regards:

<div class="h-single" id="users">
    <ul>
        @{
            foreach (var user in Model)
            {
                <li><a href="ajax/"[e-mail]><span>@user.Name</span></a></li>
            }
        }
    </ul>
    @{
        foreach (var user in Model) 
        {
            <div id=@user.EHLogin>@Html.Action("_userAdvisoryRequests", new { username = user.EHLogin })
            </div>
        }
    }
</div>

只注意到你不需要阿贾克斯内容的div所以这不是要去工作无论是。

Just noticed you don't need the divs for ajax content so that ain't gonna work either.

编辑2

解决方案：

<div class="h-single" id="users">
    <ul>
        @{
            foreach (var user in Model)
            {
                <li><a href=@Url.Action("_partial","Home", new { param = @user.Param })><span>@user.Name</span></a></li>
            }
        }
    </ul>
</div>

贷阿什维尼维尔马的回答！

Credits to Ashwini Verma for the answer!

如果在href的＆LT;李＆GT;＆LT; A＆GT; 标记引用一个div然后在div必须页面加载才能观看，但如果在href引用一个动作或再一个链接就可以按需加载。

"If the href in the <li><a> tag references a div then the div must be page-loaded in order to be viewed, but if the href references an action or a link then it can be loaded on demand."

推荐答案

的例子给jQuery的网站。

Example given on jQuery site.

如果一个标签内容窗格中引用了一个HTML元素然后在选项卡将页面加载;

If the content pane for a tab references a HTML element then the tab will be page-loaded;

<li><a href="#tabs-1">Preloaded</a></li>

如果一个标签内容窗格中引用一个URL时，标签将通过AJAX在选择标签时加载;

If the content pane for a tab references a URL, the tab will be loaded via AJAX when the tab is selected;

<li><a href="ajax/content1.html">Tab 1</a></li>

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Preloaded</a></li>
    <li><a href="ajax/content1.html">Tab 1</a></li>
    <li><a href="ajax/content2.html">Tab 2</a></li>
    <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li>
    <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li>
  </ul>
  <div id="tabs-1"></div>
</div>

<script>
  $(function() {
    $( "#tabs" ).tabs({
      beforeLoad: function( event, ui ) {
        ui.jqXHR.error(function() {
          ui.panel.html(
            "Couldn't load this tab. We'll try to fix this as soon as possible. " +
            "If this wouldn't be a demo." );
        });
      }
    });
  });
</script>

更新

的href 应是加载局部视图操作方法的URL。示例

href should be the URL of the action method which loads the partial view. Example

<a href="@Url.Action("YourActionForContent", "Home")">Load Tab Content</a>

操作方法

public PartialViewResult YourActionForContent()
{
    return PartialView("_Content");
}

这篇关于在加载标签jQueryUI的选择ASP.NET MVC局部视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！