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

Set Width of RadPanelItem In OnClientItemExpand

5 Answers 181 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
jfkrueger
Top achievements
Rank 1
jfkrueger asked on 19 Dec 2008, 09:28 PM
Is there a way to set the width of a RadPanelItem through client script in the OnClientItemExpand event?

5 Answers, 1 is accepted

Sort by
0
Accepted
Atanas Korchev
Telerik team
answered on 21 Dec 2008, 06:40 PM
Hi Joe,

You can use something similar to this:

args.get_item().get_element().style.width = "200px";

Regards,
Albert
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
jfkrueger
Top achievements
Rank 1
answered on 22 Dec 2008, 04:43 PM
Ok, that works but after seeing the results I guess it is not what I am really after. I want to change the width of the entire RadPanelBar, not just one of the RadPanelItems. I thought the RadPanelBar would expand out to the same width as the longest item but that is not the case, the Item expands out to the desired width but all the other items stay smaller which does not look right. I've tried this:


function OnClientItemExpand(sender, args) {  
 
     radPanelBar = $find("<%= rpbCSRLists.ClientID %>").width = "800px";  
         

Any ideas?

Thanks!

0
jfkrueger
Top achievements
Rank 1
answered on 22 Dec 2008, 04:52 PM
More info:

I also have OnClientItemCollapse event which was supposed to set the RadPanelItem back to it's shortened state - it only needs to expand out to a larger width when it is expanded, then it should shrink back to a smaller width so as to save real-estate on the page. If I use the OnClientItemCollapse to reset the width back down to the original width, when I expand a different item it does grow out to 800px, but any of the previous items I have selected stay at the shortened width. So while the header of the expanded item grows out to 800px, the headers of any of the other RadPanelItems that have already been expanded are staying at the shortened width, which looks funny.
0
jfkrueger
Top achievements
Rank 1
answered on 22 Dec 2008, 05:05 PM
I need to either set the width of the entire RadPanelBar or do something like this:

function OnClientItemExpand(sender, args) {  
 
        var panel = $find("<%= rpbCSRLists.ClientID %>");  
        var items = panel.get_items();  
          
        for (var i = 0; i < items.get_count(); i++) {  
            items.getItem(i).style.width = "800px";  
        }  
          
    } 

However, this throws a Javascript error stating that "style" is null or not an object.
0
jfkrueger
Top achievements
Rank 1
answered on 22 Dec 2008, 05:21 PM
Ok, I got it:

<script type="text/javascript" language="javascript">  
 
    function OnClientItemExpand(sender, args) {  
 
        var panel = $find("<%= rpbCSRLists.ClientID %>");  
        var items = panel.get_items();  
        var attributes;  
          
        for (var i = 0; i < items.get_count(); i++) {  
            items.getItem(i).get_element().style.width = '800px';  
        }  
 
    }   
      
    function OnClientItemCollapse(sender, args) {  
 
        var panel = $find("<%= rpbCSRLists.ClientID %>");  
        var items = panel.get_items();  
        var attributes;  
 
        for (var i = 0; i < items.get_count(); i++) {  
            items.getItem(i).get_element().style.width = '100%';  
        }  
 
    }  
 
</script>    
 

Just an FYI - the only reason I have to do this is because it is on a page using asp.net web parts framework. If another web part is on the page next to this part, it doesn't expand out all the way and columns get squished together. I just needed to force it to expand out to a width that the users can still easisly see the values in the columns.

Thanks!
Tags
PanelBar
Asked by
jfkrueger
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
jfkrueger
Top achievements
Rank 1
Share this question
or