3

有谁知道是否可以通过向返回 Partial 的控制器发出 Ajax 请求来加载标签条，就像使用 KendoUI Window 控件一样？

如果不是，我将简单地执行 AJAX 请求来获取我的 PartialViewResult，然后设置使用 jQuery 来设置 div 的 html。但是很高兴知道它是否可以使用 tabstrip API 来完成。

我根据 KendoUI 文档尝试了以下操作，但它似乎不起作用。

<div id="tabstrip">
    <ul>
        <li class="k-state-active">Tab 1</li>
        <li>Tab 2</li>
        <li>Tab 3</li>
    </ul>
</div>

<script>
    $(document).ready(function () {
        $("#tabstrip").kendoTabStrip({
            animation: { open: { effects: "fadeIn"} },
            contentUrls: [
                        'myController/myAction/id1',
                        'myController/myAction/id2',
                        'myController/myAction/id3'
                    ]
        });
    });
</script>

任何想法将不胜感激。

嶙峋

4

3 回答 3

1

我最终找不到一种方法来让它与控件本身一起工作，所以我想出了自己的解决方案，即在 ajax 请求中请求部分内容，然后简单地更新特定选项卡的 div 内容.

function loadTabContent() {
    $.ajax({
        type: 'GET',
        url: '/myControllerName/Action',
        async: false,
        data: { id: itemId },
        success: function (data) {
            $('#myTabStripTabStrip-2').html(data);
        }
    });
}

希望它可以帮助其他有同样问题的人。

再次感谢所有帮助我解决这个问题的人。

于 2013-09-21T10:29:25.797 回答
1

基本上我的建议是初始化小部件（没有这样的内容 URL），然后立即调用 append 方法，如此处所示。

tabStrip.append(
[{
    text: "Item 1",
    url: "http://www.kendoui.com"               // Link URL if navigation is needed, optional.
},
{
    text: "<b>Item 2</b>",
    encoded: false,                             // Allows use of HTML for item text
    content: "text"                             // Content for the content element
},
{
    text: "Item 3",
    contentUrl: "partialContent.html"           // From where to load the item content
},
{
    text: "Item 4",
    imageUrl: "http://www.kendoui.com/test.jpg" // Item image URL, optional.
},
{
    text: "Item 5",
    spriteCssClass: "imageClass3"               // Item image sprite CSS class, optional.
}]
);
于 2013-09-20T06:25:29.347 回答
0

  • 在每个“li”中，您需要为每个 div 添加一个“div”和 id。

  • 在 tabStrip 的“选择”事件中，您需要单击与此选项卡相关的 div。在本例中，我们将单击的选项卡的 div 称为“divContent”。

  • 向控制器调用 ajax 请求以获取您的 partiaview。您将获得此 ajax 调用的响应，并且您需要在上一步中的 div 中插入：

divContent.html（响应）；

我以这种方式进行操作，并且效果很好。您甚至可以添加一些 jquery 效果以使外观更好看：

divContent.html（响应）；//在 div 中设置你的响应 divContent.hide(); //隐藏divContent.fadeIn(500); //并淡入结果

我希望它有帮助

干杯，里卡多

于 2014-04-13T01:58:13.600 回答