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

OnSelectedIndexChanged event fired unexpected after page refresh in Firefox

2 Answers 91 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Don
Top achievements
Rank 1
Don asked on 10 Jun 2015, 03:00 PM

Hi there,

The RadcomboBox OnSelectedIndexChanged  event fired unexpected after I refresh page in firefox, however, it is working fine in IE and Chrome. Here is my code and scenario.

1 Use firefox to open the page

2 Select value from the first ComboBox

3 Select value from the second ComboBox

4 Refresh Page

5 Click the "Explore" button on the page, the OnSelectedIndexChanged 
event of the first RadComboBox got fired in Firefox (working fine in IE
and Chrome).

Please help. Thank you very much.

Default.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadFormDecorator ID="FormDecorator1" runat="server"  />
    <div class="qsf-demo-canvas">
        <div class="continents">
            <telerik:RadComboBox ID="RadComboBox1" runat="server" Width="186px"
                AutoPostBack="true"  Filter="Contains" datatextfield="Name" datavaluefield="ID"
                OnDataBound="ddlBox1_DataBound" OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged">
            </telerik:RadComboBox>
        </div>
        <div class="countries">
            <telerik:RadComboBox ID="RadComboBox2" runat="server" Width="186px"
                AutoPostBack="true"  Filter="Contains" datatextfield="Name" datavaluefield="ID"
                OnDataBound="ddlBox2_DataBound" OnSelectedIndexChanged="RadComboBox2_SelectedIndexChanged">
            </telerik:RadComboBox>
        </div>
        <div>
        <telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" CellSpacing="0" AllowSorting="true"
            GridLines="None" Width="800px">
            <ClientSettings>
                <Selecting AllowRowSelect="true" />
            </ClientSettings>
            <MasterTableView AutoGenerateColumns="False" DataKeyNames="ID">
                <Columns>
                    
                    <telerik:GridBoundColumn DataField="ID" DataType="System.String"
                        HeaderText="StateID" ReadOnly="True" SortExpression="ID" UniqueName="ID">
                    </telerik:GridBoundColumn>
                    <telerik:GridDateTimeColumn DataField="Name" DataType="System.String"
                       HeaderText="Name" SortExpression="Name" UniqueName="Name">
                    </telerik:GridDateTimeColumn>
                </Columns>
            </MasterTableView>
            <FilterMenu EnableImageSprites="False">
            </FilterMenu>
        </telerik:RadGrid>
            </div>
        <p class="buttons">
            <asp:Button ID="Button1" runat="server" Text="Explore" OnClick="Button1_Click" />
        </p>
        <div class="result">
            <asp:Label runat="server" ID="Literal1" />
        </div>
    </div>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadComboBox1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadComboBox2" />
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadComboBox2">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    </form>
</body>
</html>

 

Code behind

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Linq;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Web.Security;
using System.Collections.Generic;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Telerik.Web.UI;
  
public partial class Default : System.Web.UI.Page
{
    public class State
    {
        public String ID { get; set; }
        public String Name { get; set; }    
    }
  
    public class City
    {
        public String ID { get; set; }
        public String Name { get; set; }
        public String StateID { get; set; }
    }
  
    public List<State> GetStateList()
    {
        List<State> _list = new List<State>();
  
        State d1 = new State();
        d1.Name = "AB";
        d1.ID = "1";
  
        State d2 = new State();
        d2.Name = "BC";
        d2.ID = "2";
  
        State d3 = new State();
        d3.Name = "ON";
        d3.ID = "3";
  
        _list.Add(d1);
        _list.Add(d2);
        _list.Add(d3);
  
        return _list;
    }
  
    public List<City> GetCityList(String _stateID)
    {
        List<City> _list = new List<City>();
        List<City> _newList = new List<City>();
  
        City c1 = new City();
        c1.Name = "Calgary";
        c1.ID = "1";
        c1.StateID = "1";
  
        City c2 = new City();
        c2.Name = "Edmonton";
        c2.ID = "2";
        c2.StateID = "1";
  
        City c3 = new City();
        c3.Name = "Vancouver";
        c3.ID = "3";
        c3.StateID = "2";
  
        City c4 = new City();
        c4.Name = "Victoria";
        c4.ID = "4";
        c4.StateID = "2";
  
        City c5 = new City();
        c5.Name = "Toronto";
        c5.ID = "5";
        c5.StateID = "3";
  
  
        City c6 = new City();
        c6.Name = "Ottawa";
        c6.ID = "6";
        c6.StateID = "3";
  
        _list.Add(c1);
        _list.Add(c2);
        _list.Add(c3);
        _list.Add(c4);
        _list.Add(c5);
        _list.Add(c6);
  
        var _result = _list.Where(t => t.StateID == _stateID);
  
        foreach (var _item in _result)
        {
            City d = new City();
            d.ID = _item.ID;
            d.StateID = _item.StateID;
            d.Name = _item.Name;
            _newList.Add(d);
        }
  
        return _newList;
    }
  
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
            LoadBox1();
    }
  
    protected void RadComboBox1_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
    {
        if (e.Value != String.Empty)
        {
            LoadBox2(e.Value);
            List<State> _test = new List<State>();
            RadGrid1.DataSource = _test;
            RadGrid1.DataBind();
        }
    }
  
    protected void RadComboBox2_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
    {
        if (e.Value != String.Empty)
        {
            LoadGrid();
        }
    }
  
    public void LoadGrid()
    {
        RadGrid1.DataSource = GetStateList();
        RadGrid1.DataBind();
    }
  
    protected void LoadBox1()
    {
        RadComboBox1.DataSource = GetStateList();
        RadComboBox1.DataBind();
    }
  
    protected void LoadBox2(string _stateID)
    {
        RadComboBox2.DataSource = GetCityList(_stateID);
        RadComboBox2.DataBind();
    }
  
    protected void ddlBox1_DataBound(object sender, EventArgs e)
    {
        var combo = (RadComboBox)sender;
        combo.Items.Insert(0, new RadComboBoxItem("Please Select", String.Empty));
  
        RadComboBox2.Items.Insert(0, new RadComboBoxItem("Please Select", String.Empty));
    }
  
    protected void ddlBox2_DataBound(object sender, EventArgs e)
    {
        var combo = (RadComboBox)sender;
        combo.Items.Insert(0, new RadComboBoxItem("Please Select", String.Empty));
    }
  
    protected void Button1_Click(object sender, EventArgs e)
    {
        //Literal1.Text = string.Empty;
    }
}
:

2 Answers, 1 is accepted

Sort by
0
Accepted
Dimitar
Telerik team
answered on 12 Jun 2015, 07:45 AM
Hello,

The observed behavior is a Firefox browser specific and it is not caused by the Telerik UI for ASP.NET AJAX controls. The Firefox feature in question autocompletes data entered in inputs and text areas to prevent data loss from accidental page refreshes. You could test this by placing an input type="text" element on a page and type in it. On refresh Firefox would keep the text written in it.

You could prevent this behavior by setting the form AutoComplete property to Off (autocomplete="off"):

<form id="form1" runat="server" autocomplete="off">
...
</form>

And last, but not least, you could read more about the issue and solution suggestions in the following StackOverflow thread.


Regards,
Dimitar
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Don
Top achievements
Rank 1
answered on 12 Jun 2015, 08:29 PM
Thank you for your help, Dimitar. Set autocomplete="off" fixed the issue.
Tags
ComboBox
Asked by
Don
Top achievements
Rank 1
Answers by
Dimitar
Telerik team
Don
Top achievements
Rank 1
Share this question
or