문제

How do I hide a single tab on a MVC/Kendo UI tabstrip?

I want to hide a tab based on a condition. My jQuery code goes like this:


        //authUser is a hidden input whose value is set in the controller and passed into the view

        if ($('#authUser').val() == 'False') //hide the last tab
        {
            $($("#tabstrip").data("kendoTabStrip").items()[6]).attr("style", "display:none");
        }

When I run the code I get the following error on the line of code that's executed if authUser is False:

JavaScript runtime error: Unable to get property 'items' of undefined or null reference

Ideas?

도움이 되었습니까?

해결책

The fact that 'items' is undefined implies that you never appropriately selected the tabstrip in the first place. Either your CSS selector is wrong (are you sure you named it tabstrip?) or you did not follow the Kendo method names appropriately.

Here are two ways I found to hide the last tab:

Hiding the last tabstrip element

var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
//Find the last tab item's index from the items list
var lastIndex = tabStrip.items().length - 1;
//Use jQuery's hide method on the element
$(tabStrip.items()[lastIndex]).hide();

Using Kendo's tabstrip remove method

I believe the following is more appropriate. Why not use the tabstrip's remove method and completely remove it from the DOM since the user should not have access anyway?

var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
tabStrip.remove("li:last");

다른 팁

I'm just stupid.... I looked some more at the code and I was leaving out the kendoTabStrip() word (bolded) from

$($("#tabstrip").kendoTabstrip().data("kendoTabStrip").items()[6]).attr("style","display:none")

i.e. Instead of (properly) having:

$($("#tabstrip").kendoTabStrip().data("kendoTabStrip").items()[6]).attr("style","display:none") 

I had:

$($("#tabstrip").data("kendoTabStrip").items()[6]).attr("style","display:none") 

Drew, thanks for your effort. Sometimes I just have to beat my head on a wall until I see what I've done.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top