Browser:
Microsoft Edge 44.18362.449.0
Telerik Control:
RadCombobox
Teleri Version: Version=2017.3.913.45,
Issue:
When a item is selected and a postback is occured, the SelectedValue returns an empty string.
Expected behavior:
The correct SelectedValue should be return.
Thing that have been tried so far:
1: upgrade the telerik to the latest version (2020.114) ---> issue persists
2: set autopostback to "true" problem solved
3: use other browsers (chrome, FireFox, new Version 79.0.309.68 ) issue disappears
Sample code:
1: aspx
<
telerik:radcombobox
id
=
"ddlSupplier"
runat
=
"server"
skin
=
"Material"
rendermode
=
"Lightweight"
cssclass
=
"materializeit"
enableloadondemand
=
"true"
inputcssclass
=
"browser-default"
width
=
"100%"
filter
=
"Contains"
highlighttemplateditems
=
"true"
showmoreresultsbox
=
"false"
onitemsrequested
=
"ddlSupplier_ItemsRequested"
autopostback
=
"false"
>
</
telerik:radcombobox
>
2: code behind
protected void Page_Load(object sender, EventArgs e)
{
}
protected void saveIssue_Click(object sender, EventArgs e)
{
}
protected void ddlSupplier_ItemsRequested(object sender, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
{
RadComboBoxItem li = new RadComboBoxItem("Alan Jones (Brunel Systems Pty Ltd, test site)", "123");
ddlSupplier.Items.Add(li);
li = new RadComboBoxItem("Jackie Chiu (Optimum Construction, Optimum Construction (Sydney)) ", "23" );
ddlSupplier.Items.Add(li);
li = new RadComboBoxItem("Erik Baker (Optimum Construction, Optimum Construction (Sydney))", "2323");
ddlSupplier.Items.Add(li);
}
protected void b_Click(object sender, EventArgs e)
{
var a = ddlSupplier.SelectedValue; // most of the time returns "" for Edge
}
In WebService binding scenario, the text of the items is not encoded and HTML code might get executed.
In Server-side Load on Demand binding this is not observed.
The following code can be used as a temporary workaround for WebService binding scenario:
<script type="text/javascript">
Telerik.Web.UI.RadComboBoxItem.prototype._renderItemContent = function (d) {
if (this.get_imageUrl()) {
this._renderImage(d);
}
//https://stackoverflow.com/questions/6234773/can-i-escape-html-special-chars-in-javascript
function escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&")
.replace(/</g, "<")
.replace(/>/g, ">")
.replace(/"/g, """)
.replace(/'/g, "'");
}
d[d.length] = escapeHtml(this.get_text());
}
</script>
To maintain accessibility consistency with normal HTML select comboboxes, we need the RadComboBox to support the Home and End keys to jump to the 1st and last item respectively. Currently, it just moves the text cursor to the start/end of the textfield. If the change can't be made globally, can a new property be set to control this behavior? Ideally too, Page Up/Down can jump multiple items at a time. Currently, it scrolls the page. See a 2009 forum post too (from someone else): http://www.telerik.com/forums/radcombobox-home-end-page-up-page-down-keys I see the other keyboard shortcuts listed here: http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/keyboardsupport/defaultcs.aspx Per Anton: The keyboard support is specification is implemented according to the article (https://www.w3.org/TR/2013/WD-wai-aria-practices-20130307/#combobox) which is why there is no support for these keys. We would like to request these additional keys be supported anyway. [From ticket 1083598]
Reproduction: https://demos.telerik.com/aspnet-ajax/combobox/examples/wai-aria-support/defaultcs.aspx
1) focus the ComboBox
2) press C
Expected:
- Camembert Pierrot is selected
- JAWS pronounces "c" and "Camembert Pierrot"
Actual:
- Camembert Pierrot is selected
- JAWS pronounces "c"
Reference for expected behavior: https://www.w3.org/TR/wai-aria-practices/examples/listbox/listbox-collapsible.html
please add native columns support for radcombobox <Columns> <Column DataField="CategoryName" /> <Column DataField="Description" /> </Columns> best regards
RadCombobox WAI-ARIA improvements
1. When we have a selection but do not have filtering and custom text:
aria-autocomplete: list ---> Combobox list item
2. When we have selection and filtering: ---> Combobox inline completion list item
aria-autocomplete: both
3. disabled: aria-autocomplete: none
In combo box once a value is selected there is no option to clear the selection. We can have an additional button outside the combo box to achieve the same.
This will require some additional coding.
Since this is a regular scenario why can't there be a property within the RadCombo Box that makes clear selection button visible next to the combo box drop-down button and does the task of clearing the selection?
If the same text is typed into the input field as the one set for EmptyMessage and page is submitted, validator evaluates True. Current workaround is to subscribe the RadComboBox to OnClientFocus client event handler, and clear the EmptyMessage manually, thus preventing the EmptyMessage text to be sent to server. <telerik:RadComboBox ... OnClientFocus="comboFocus"> <script type="text/javascript"> function comboFocus(sender, args) { sender.set_emptyMessage(""); } </script>
A possible workaround would be tweaking the ItemRequestTimeout property of the ComboBox <telerik:RadComboBox ItemRequestTimeout="380" runat="server" ... > ... </telerik:RadComboBox>
The ComboBox pop-up is moving over the page during scrolling in mobile Chrome (Android device). The problem is occurres both in scrolled or zoomed elements. *The same issue is reproducible also in the SkinChooser. Steps to reproduce: 1. Run the following code in in mobile Chrome: <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" PersistenceMode="ViewState" RenderMode="Auto" Skin="Telerik"> </telerik:RadSkinManager><br /><br /> <telerik:RadComboBox ID="cb1" runat="server" AutoPostBack="true"> <Items> <telerik:RadComboBoxItem Text="January" Value="1" /> <telerik:RadComboBoxItem Text="February" Value="2" /> <telerik:RadComboBoxItem Text="March" Value="3" /> <telerik:RadComboBoxItem Text="April" Value="4" /> <telerik:RadComboBoxItem Text="May" Value="5" /> <telerik:RadComboBoxItem Text="June" Value="6" /> <telerik:RadComboBoxItem Text="July" Value="7" /> </Items> </telerik:RadComboBox> 2. Tap over the combo in order to show its dropdown 3. Drag to scroll the page to the left Result: The dropdown pop-up is moving over the page.