When selecting an Item and performing a PostBack, the selected item's value is not accessible once the page reloads.
Hello Everyone,
I'm excited to announce that the issue with MultiSelect selection retention on Chrome 131.0.6778.70 has been resolved in our latest release: version 2024.4.1114.
You can download the updated release files from your Telerik account here:
Alternatively, the updated package is also available via the Telerik NuGet feed.
You can also find upgrade instructions in the Upgrade to a Newer Version of Telerik® UI for ASP.NET AJAX article.
If you’ve been using the provided workaround, we encourage you to update to this new version for a permanent solution. Please don’t hesitate to share your feedback or report any further issues you may encounter.
Thank you for bringing this to our attention and for your support!
Regards,
Rumen
Progress Telerik
Hi Harshith,
Thank you for reporting this Chrome 131 breaking change!
We are finalizing a hotfix to address this issue comprehensively, and I’m happy to let you know that it is scheduled for release later today. Once it’s available, I will notify to download and update the assembly files.
For the earlier versions, you can apply the following workaround:
Add the following Script anywhere on the page but after the ScriptManager declaration.
<script>
(function () {
try {
var original_initialize = Telerik.Web.UI.RadMultiSelect.prototype._initialize;
Telerik.Web.UI.RadMultiSelect.prototype._initialize = function () {
var $selectElement = $(this.get_element());
var $tempWrapper = $('<div></div>').insertBefore($selectElement);
$selectElement.children().appendTo($tempWrapper);
original_initialize.call(this);
$tempWrapper.children().appendTo($selectElement.closest('.RadMultiSelect'));
$tempWrapper.remove();
}
} catch (e) {
// Nothing to do
}
})()
</script>
Note: If the above workaround does not work, you can try following approach:
<telerik:RadMultiSelect ID="rcbUsers" runat="server" Width="500px" DropDownHeight="200px"
DataValueField="UserID" DataTextField="UserName" TagMode="Multiple" AutoPostBack="true">
<ClientEvents OnLoad="onMultiSelectLoad" />
</telerik:RadMultiSelect>
<script>
function onMultiSelectLoad(sender) {
handleClientStateInput(sender);
}
function handleClientStateInput(sender) {
// Chrome 131 breaking change fix
var clientStateFieldId = sender.get_clientStateFieldID();
var controlWrapper = sender.get_element();
var parentContainer = controlWrapper.parentElement;
if (!parentContainer) {
return; // Exit if the parent container is not found
}
// Check if the ClientState input exists
var existingInput = document.getElementById(clientStateFieldId);
if (existingInput) {
// Ensure the input is within the correct container
if (existingInput.parentElement !== parentContainer) {
parentContainer.appendChild(existingInput);
}
} else {
// Recreate the hidden input element if it doesn't exist
var clientStateInput = document.createElement("input");
clientStateInput.id = clientStateFieldId;
clientStateInput.name = clientStateFieldId;
clientStateInput.type = "hidden";
clientStateInput.autocomplete = "off";
// Set the initial value for the ClientState
clientStateInput.value = sender.saveClientState();
// Append the hidden input to the parent container
parentContainer.appendChild(clientStateInput);
}
}
</script>
Regards,
Rumen
Progress Telerik