RadPanelBar - Refresh whole page instead of using Ajax

[Gary]

I am currently having an issue using the RadPanelBar i would like it to change the visible of the corresponding div to true without refreshing the whole page. I have it working with a button doing a submit but i can't seem to get it to work correctly using the RadPanelBar. I am sure its just a minor setting but i can't seem to figure it out.

Example: i would like if a user who clicks an item in the radpanelbar to change the visibility of an item WITHOUT refreshing the whole page. 


Example:
I have configured it with three different groups.

Group A
  Click 1
  Click 2
  Click 3


<Div id="one" visible =false>
Test1
</div>

<Div id="two" visible =false>
Test1
</div>


etc...

in the code behind i have the following code:

        Dim item = RadPanelBar1.SelectedItem.Text

        If item = "Click 1" Then

            Me.one.Visible = True

            Me.two.Visible = False

        End If

        If item = "Click 2" Then

            Me.one.Visible = False

            Me.two.Visible = True

        End If

See screen shots to see how i configure the Ajax Manager. PLEASE HELP!!!


Gary

[Nikolay Tsenkov]

Hi Gary,

I have tested this myself, and indeed the visible property doesn't make a difference. This obviously is core asp.net problem, and shouldn't be related to our controls.

Anyway, I took some time to provide you with working example on how to change the visibility of div-containers on the server-side and in Ajax call and doing all that on itemClick event of the panelBar.

Here is the markup:

<div>
    <asp:ScriptManager runat="server" ID="ScriptManager1" />
    <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadPanelBar1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="container1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadPanelBar runat="server" ID="RadPanelBar1" OnItemClick="RadPanelBar1_ItemClick">
        <Items>
            <telerik:RadPanelItem Text="ClickMe!" />
        </Items>
    </telerik:RadPanelBar>
    <div id="container1" runat="server" style="visibility: hidden">
        <a>sdfgsdfgsdfgsdfg</a>
    </div>
</div>

Here is the handler for the ItemClick event:

protected void RadPanelBar1_ItemClick(object sender, RadPanelBarEventArgs e)
{
    if (container1.Style["visibility"] == "hidden")
    {
        container1.Style["visibility"] = "visible";
    }
    else
    {
        container1.Style["visibility"] = "hidden";
    }
}

I hope this will work for you!


Regards,
Nikolay Tsenkov
the Telerik team