Sliding Panel bar issue when postback occurs

[Dorababu]

Hi all I used the following example

http://demos.telerik.com/aspnet-ajax/panelbar/examples/applicationscenarios/slidingpanelbar/defaultcs.aspx 

every thing works fine but inside my panel bar I am having a RadioButton List  which causes a postback, due to this the sliding panel bar closes. How can I over come this error

This is my design

<div class="leftPanelBarContainer">
        <div id="slidingDiv" style="visibility: hidden" runat="server">

    <telerik:RadPanelBar runat="server" ID="rdpbSalary" ExpandMode="FullExpandedItem"
                Skin="Vista" EnableEmbeddedSkins="false" Width="550px" Height="300px">
                <Items>
                    <telerik:RadPanelItem Expanded="true" Text="Employee Salary Information" runat="server"
                        Selected="true">
                        <Items>
                            <telerik:RadPanelItem Value="SalaryInformation" runat="server">
                                <ItemTemplate>
                                    <div style="float: right; font-family: Verdana; margin-right: 15px;">
                                        <span style="color: Red;">*</span> Denotes are Mandatory
                                    </div>
                                    <br />
                                    <div class="text" style="background-color: #ffffff">
                                        <ul class="formList" id="salaryinfo">
                                            <li>
                                                <asp:Label Width="155px" runat="server" CssClass="label1" ID="lblSalaryPayRate" AssociatedControlID="rdbtnlstPayRate">What is the Pay Rate? <span style="color:Red">*</span></asp:Label>
                                                <asp:RadioButtonList ID="rdbtnlstPayRate" runat="server" AutoPostBack="true" RepeatDirection="Horizontal"
                                                    OnSelectedIndexChanged="rdbtnlstPayRate_SelectedIndexChanged" Style="width: 155px"
                                                    ValidationGroup="salaryValidation1">
                                                    <asp:ListItem Value="S">Salary</asp:ListItem>
                                                    <asp:ListItem Value="H">Hourly</asp:ListItem>
                                                </asp:RadioButtonList>
                                                <asp:RequiredFieldValidator ID="rfvsalaryTypeID" runat="server" ControlToValidate="rdbtnlstPayRate"
                                                    CssClass="error" ErrorMessage="Please Select One Pay Rate" ValidationGroup="salaryValidation1"></asp:RequiredFieldValidator>
                                            </li>
                                            <li>
                                                <asp:Label runat="server" Width="150px" CssClass="label1" ID="lblsalaryPeriodWages"
                                                    AssociatedControlID="txtsalaryPeriodWages">Period Wages <span style="color:Red">*</span></asp:Label>
                                                <telerik:RadNumericTextBox runat="server" ID="txtsalaryPeriodWages" Width="200px"
                                                    ValidationGroup="salaryValidation" IncrementSettings-InterceptMouseWheel="false"
                                                    IncrementSettings-InterceptArrowKeys="false">
                                                </telerik:RadNumericTextBox>
                                                <asp:RequiredFieldValidator runat="server" ID="rqrdsalaryWages" ValidationGroup="salaryValidation"
                                                    ForeColor="Red" ControlToValidate="txtsalaryPeriodWages" ErrorMessage="Required Period Wages"></asp:RequiredFieldValidator>
                                            </li>
                                            <li>
                                                <asp:Label runat="server" CssClass="label1" Width="150px" ID="lblsalaryRatePay" AssociatedControlID="txtsalaryRatePay">Rate of Pay <span style="color:Red">*</span></asp:Label>
                                                <telerik:RadNumericTextBox runat="server" ID="txtsalaryRatePay" Width="200px" ValidationGroup="hourlyValidation"
                                                    IncrementSettings-InterceptMouseWheel="false" IncrementSettings-InterceptArrowKeys="false">
                                                </telerik:RadNumericTextBox>
                                                <asp:RequiredFieldValidator runat="server" ID="rqrdsalaryRatePay" ValidationGroup="hourlyValidation"
                                                    ForeColor="Red" ControlToValidate="txtsalaryRatePay" ErrorMessage="Required Rate of Pay "></asp:RequiredFieldValidator>
                                            </li>
                                            <li>
                                                <asp:Label runat="server" CssClass="label1" Width="150px" ID="lblSalaryOthers" AssociatedControlID="txtsalaryOthers">Hours <span style="color:Red">*</span></asp:Label>
                                                <telerik:RadNumericTextBox runat="server" ID="txtsalaryOthers" Width="200px" ValidationGroup="hourlyValidation"
                                                    IncrementSettings-InterceptMouseWheel="false" IncrementSettings-InterceptArrowKeys="false">
                                                </telerik:RadNumericTextBox>
                                                <asp:RequiredFieldValidator runat="server" ValidationGroup="hourlyValidation" ID="rqrdsalaryOther"
                                                    ControlToValidate="txtsalaryOthers" ErrorMessage="Required Other Hours Rate"
                                                    ForeColor="Red"></asp:RequiredFieldValidator>
                                            </li>
                                        </ul>
                                        <br />
                                        <asp:ValidationSummary runat="server" ID="validationSummary2" CssClass="validationSummary" />
                                        <table style="margin-left: 50px;">
                                            <tr>
                                                <td>
                                                    <telerik:RadButton ID="rdbtnsalarySave" ValidationGroup="salaryValidation1" runat="server"
                                                        Text="Save & Next" OnClick="rdbtnsalarySave_Click">
                                                    </telerik:RadButton>

                                                    <telerik:RadButton ID="rdbtnsalaryCancel" runat="server" Text="Cancel" OnClick="rdbtnsalaryCancel_Click">
                                                    </telerik:RadButton>
                                                    <br />
                                                </td>
                                            </tr>
                                        </table>
                                        <br />
                                    </div>
                                </ItemTemplate>
                            </telerik:RadPanelItem>
                        </Items>
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelBar>


        </div>
        <telerik:RadCodeBlock ID="rdcode" runat="server">
            <script type="text/javascript">
                var panelDomElement = $get('<%= rdpbSalary.ClientID %>');
                var timage = $get('<%= lnkAdd.ClientID %>');

                if (panelDomElement) {
                    SetUpAnimation(timage.id, Telerik.Web.UI.jSlideDirection.Center, panelDomElement);
                }


                function SetUpAnimation(image, direction, element) {
                    element.style.position = "relative";
                    var slider = document.getElementById(image);

                    var expanded = false;

                    var expandAnimation = new Telerik.Web.UI.AnimationSettings({});
                    var collapseAnimation = new Telerik.Web.UI.AnimationSettings({});

                    var slide = new Telerik.Web.UI.jSlide(element, expandAnimation, collapseAnimation, false);

                    slide.initialize();

                    slide.set_direction(direction);

                    slider.onclick = function () {
                        element.parentNode.style.visibility = "visible";
                        element.parentNode.style.display = "block";
                        if (!expanded) {
                            slide.expand();
                        }
                        else {
                            slide.collapse();
                        }
                        expanded = !expanded;
                        return false;
                    }
                }
            </script>
        </telerik:RadCodeBlock>
    </div>

[Kate]

Hi Dorababu,

When you have a post back of the page it is expected that the

Here are few approaches that you can try out. The first one is to set the AutoPostBack="false" of the RadioButtonList, so that the page does not postback when you select an item from the RadioButtonList. Another one is to use the RadAjaxPanel and make an ajax request instead of a full postback of the page (for instance you can wrap the template in the RadPanelBar control).  
 
Kind regards,
Kate
the Telerik team