Set the Rad splitter height and width on window resize

[Nataraj Vedula]

Hi,

I wrote a small script to set the height and width of splitter on window resize. I am getting an script error saying that object doesn't support this property or method. Please help me to set the desired height and width for the splitter. Below is the script.

<script type="text/javascript">
    window.onresize=resized;
    function resized()
    {
        var splitter = document.getElementById("ctl00_ReportContent_Splitter1").id;
        splitter.set_height(document.getElementById("ctl00_ReportContent_ReportRow").clientHeight);
        splitter.set_width(document.getElementById("ctl00_ReportContent_ReportRow").clientWidth);
    }
 </script>

I even tried spliiter.resize(). This also gave JS error. I referred the splitter's ClientSide API from http://www.telerik.com/help/aspnet-ajax/splitter_clientsideradsplitter.html.

Thanks,
Nataraj

[Vyrban]

HI,

I think, you use the correct methods but in the wrong level of abstraction. As i see in your code:

var splitter = document.getElementById("ctl00_ReportContent_Splitter1").id;

splitter is not an object, but string! So you can not expect splitter.set_height and splitter.set_width to work.

Regards,
Vyrban.

[Antony]

Hi,

In case anybody else is viewing this thread. Nataraj would have been better off referencing the object like this

var splitter = $find("ctl00_ReportContent_Splitter1");

Antony

[Svetlina Anati]

Hi guys,

Actually, Antony is correct and if you have to use the control's API you should reference its client object which should be done by using the $find method. By using the getElementById or $get methods, you reference a HTML element and it does not support the API of the client object.

I also recommend to use block brackets in order to dynamically evaluate the client ID instead of hard-coding it as shown below:

var splitter = $find("<%=Splitter1.ClientID%>");

Sincerely yours,
Svetlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Eric]

Hi Svetlina,

I am trying to size a splitter and your answer above should help but my splitter is in a master page and it looks like the "<%=Splitter1.ClientID%>" is not allowed in a master page.

Is there an easy way around this?

Eric

[Tsvetie]

Hello Eric,
You can just wrap your javascript code in a RadCodeBlock. Please refer to our online documentation for information on this control.

Regards,
Tsvetie
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.

[Eric]

Thanks