New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Back Button and SelectedValue

PROBLEM

Steps to reproduce the problem:

  1. Select a combo item

  2. Use Response.Redirect or Server.Transfer to go to another page

  3. Click on the Back button of the browser

The combobox shows the correct text, but the SelectedValue property is not correct (the SelectedItem is lost).

WORKAROUND

  1. Add a hidden field to the page which will hold the selected value of the combobox:

    <div class='tabbedCode'><pre lang="ASPNET"><code>
    &lt;input type="hidden" id="RadComboBox1Value" value="" /&gt;
    
    ````
    

  2. Subscribe to the OnClientSelectedIndexChanged event and update that hidden field:


function onSelectedIndexChanged(sender, eventArgs) {
    $get("RadComboBox1Value").value = eventArgs.get_item().get_value();
}

  1. On pageLoad() check for the value of the hidden field. If it is not empty - find the appropriate combo item and select it:

function pageLoad() {
    var savedValue = $get("RadComboBox1Value").value;
    var combo = $find('<%= RadComboBox1.ClientID %>');
    if (savedValue != "" && combo.findItemByValue(savedValue)) {
      combo.findItemByValue(savedValue).select();
    }
}

Here is the final code:

<telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBox1"
   runat="server"
   OnClientSelectedIndexChanged="onSelectedIndexChanged">
   <Items>
       <telerik:RadComboBoxItem runat="server" Text="Red" Value="red" />
       <telerik:RadComboBoxItem runat="server" Text="Blue" Value="blue" />
       <telerik:RadComboBoxItem runat="server" Text="Green" Value="Green" />
   </Items>
</telerik:RadComboBox>

<input type="hidden" id="RadComboBox1Value" value="" />

<asp:Button ID="Button1" runat="server" Text="Button that Redirects" />
<script type="text/javascript">
    function pageLoad() {
        var savedValue = $get("RadComboBox1Value").value;
        var combo = $find('<%= RadComboBox1.ClientID %>');

        if (savedValue != "" && combo.findItemByValue(savedValue)) {
            combo.findItemByValue(savedValue).select();
        }
    }

    function onSelectedIndexChanged(sender, eventArgs) {
        $get("RadComboBox1Value").value = eventArgs.get_item().get_value();
    }
</script>
In this article