Yet Another JavaScript RadComboBox SelectedValue problem

[ToltingColtAcres]

Similar to the dozens of other threads posted with retrieving a combobox value in client-side code, I cannot get this to work. After spending the past 8 hours trying to get this to work, hopefully someone can point out what I am doing wrong.

I started with this basic code:

<%@ Page Title="" Language="C#" MasterPageFile="~/My.Master" AutoEventWireup="true" CodeBehind="MyPage.aspx.cs" Inherits="MyPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <title>My Page</title>
    <link rel="stylesheet" type="text/css" href="/CSS/MyPage.css" />
    <script type="text/javascript" src="/Scripts/MyPage.js"></script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="body" runat="server">
   <telerik:RadComboBox ID="RadComboBoxADT" runat="server" />
   <telerik:RadButton ID="btnSubmit" runat="server" Text="Submit" OnClientClicked="onSubmitClick" SingleClick="true" SingleClickText="Processing..." AutoPostBack="false" />
</asp:Content>

MyPage.js:

            function onSubmitClick(a,b) {
                var combo = $find("<%= RadComboBoxADT.ClientID %>");
                alert(combo);
                return;
}

running this code, combo yields "null", so any attempt to get the selected item fails as well.

I tried moving the code from a <script> file, into the content header, e.g.

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

    <title>My Page</title>

    <link rel="stylesheet" type="text/css" href="/CSS/MyPage.css" />

    <script type="text/javascript">
            function onSubmitClick(a,b) {
                var combo = $find("<%= RadComboBoxADT.ClientID %>");
                alert(combo);
                return;
}


    </script>

</asp:Content>

however, all this managed to do was yield a javascript error, onSubmitClick not found, on page load (why? if I view code, I can see it there.)

another set of eyes here would be appreciated.

 

 

[Peter Milchev]

Hello,

We have tested both scenarios and they are working as expected. 

Regarding the approach with the external JavaScript file, the server id cannot be used there (e.g. <%= RadComboBoxADT.ClientID %> is not allowed in a .js file). To fix that, you can just set the  client-side id of the ComboBox is a variable which you can use in the file: 

Default.aspx page: 

<script>
    window.ControlClientIdCollection = {};
    window.ControlClientIdCollection["RadComboBoxADT"] = "<%= RadComboBoxADT.ClientID %>"
    //window.comboBoxId = "<%= RadComboBoxADT.ClientID %>";
</script>

scripts.js file: 

function onSubmitClick(a, b) {
    //var combo = $find(window.comboBoxId);
    var combo = $find(window.ControlClientIdCollection["RadComboBoxADT"]);
    var selectedItem = combo.get_selectedItem();
    var text = combo.get_text();
    var value = combo.get_value();
    //alert(combo);
    alert(text);
}

Regarding the direct paste of the file, if you have AJAX-enabled the page, it might be required to have the RadCodeBlock or RadScriptBlock wrapping the <script> tag - RadCodeBlock and RadScriptBlock.

Attached is a sample page implementing the working JavaScript file reference. If you still have issues, please modify the attached project and send it to us in an official support ticket. That would allow us to investigate your exact scenario locally and help you more efficiently. 

Once we have a solution in the private thread, we can share it here, for convenience and better visibility of the community.

Regards,
Peter Milchev
Progress Telerik