This is a migrated thread and some comments may be shown as answers.

contentURLs not pulling data

1 Answer 36 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 04 Aug 2015, 03:32 PM

Hello, I have my tabstrip configured to pull dynamic content for each tab using the contentURLs property like so:

 

<!-- TABSTRIP -->
<div id="tabstrip-revenue-by-product">
    <ul>
        <li class="k-state-active">
            Revenue by HCPC
        </li>
 
        <li>
            Versus Prior Month
        </li>
 
        <li>
            YTD
        </li>
 
        <li>
            Normalized Revenue
        </li>
    </ul>
 
    <!-- Revenue by HCPC -->
    <div class="revenue-by-hcpc">
         
    </div>
 
    <!-- Versus Prior Month -->
    <div class="versus-prior-month">
         
    </div>
 
    <!-- YTD -->
    <div class="ytd">
         
    </div>
 
    <!-- Normalized Revenue -->
    <div class="normalized-revenue">
         
    </div>
 
</div> <!-- End Tabstrip -->
 
<script>
$(document).ready(function () {
    $("#tabstrip-revenue-by-product").kendoTabStrip({
            animation: {
                open: {
                    effects: "fadeIn"
                }
            },
            contentUrls: [
                "Views/Reports/Widgets/revenue-by-hcpc.aspx",
                "Views/Reports/Widgets/versus-prior-month.aspx",
                "Views/Reports/Widgets/ytd.aspx",
                "Views/Reports/Widgets/normalized-revenue.aspx"
            ]
        });
});
</script>

But the contentURLs never fire. I use Firebug to track any AJAX calls, but none are being made. It's not like I have a bad path to the file, because I don't even see the request. 

1 Answer, 1 is accepted

Sort by
0
Konstantin Dikov
Telerik team
answered on 06 Aug 2015, 11:06 AM
Hello John,

The issue in your scenario is due to the fact that you are DIV elements are not empty (containing an empty line). As documented in the following help article, "Content DIVs should be empty for AJAX loading to work":
Here is the correct way for defining your DIV elements:
<div class="revenue-by-hcpc"></div>
<!-- Versus Prior Month -->
<div class="versus-prior-month"></div>
<!-- YTD -->
<div class="ytd"></div>
<!-- Normalized Revenue -->
<div class="normalized-revenue"></div>

Hope this helps.


Regards,
Konstantin Dikov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
TabStrip
Asked by
John
Top achievements
Rank 1
Answers by
Konstantin Dikov
Telerik team
Share this question
or