JavaScript RadComboBox SelectedValue

12 posts, 0 answers
  1. archimede
    archimede avatar
    108 posts
    Member since:
    Jul 2006

    Posted 16 Jul 2010 Link to this post

    I want to obtain via Javascript the SelectedValue of a RadComboBox but it seem not possible.
    My goal is to change (clientside) RadComboBox1 selectedvalue, starting from another javascript event.

    Here you can find the example page:

    <asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolderBody" runat="Server">
        <script type="text/javascript">  
            function getvalue()  
            {
                var combo = <%=RadComboBox1.ClientID %>;
                alert(combo.SelectedItem);
                alert( document.getElementById(combo.UniqueID + "_value").value );
            }  
        </script>
        <telerik:RadComboBox ID="RadComboBox1" runat="server">
            <Items>
                <telerik:RadComboBoxItem Text="Item1" Value="Value1" />
                <telerik:RadComboBoxItem Text="Item2" Value="Value2" />
                <telerik:RadComboBoxItem Text="Item3" Value="Value3" />
            </Items>
        </telerik:RadComboBox>
        <input id="Button1" type="button" value="button" onclick="getvalue();" />
    </asp:Content>

    Anyone can help?
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 19 Jul 2010 Link to this post

    Hello,

    You could use the $find() method to get reference to AJAX control's client object.

    Here is the sample code:
    <script type="text/javascript"
        function getvalue() 
        {
            var combo = $find('<%=RadComboBox1.ClientID %>');
            alert(combo.get_selectedItem().get_value());
        
    </script>


    And for more information about client methods of RadComboBox, go through the links below:
    RadComboBox object
    RadComboBoxItemCollection object


    -Shinu.
  3. Jehad
    Jehad avatar
    1 posts
    Member since:
    Sep 2012

    Posted 09 Sep 2012 Link to this post


    telerik RadComboBox  :: Get Selected value by js



    function getSelectedValue() {

     var ddlCurrency = document.getElementById('ddlCurrencyID');

     var selectedValue = ddlCurrency.control._value;

     var selectedText =  ddlCurrency.control._text;

    }

  4. Nencho
    Admin
    Nencho avatar
    1880 posts

    Posted 10 Sep 2012 Link to this post

    Hello,

    Considering we aim to get the value of an Ajax Control, the better approach is to access the client instance of the control with $find() instead of accessing the DOM element with document.getElementById(). Please consider implementing the approach that Shinu has proposed.
     
    Kind regards,
    Nencho
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  5. Rajeeve
    Rajeeve avatar
    3 posts
    Member since:
    Aug 2016

    Posted 11 Aug 2016 Link to this post

    var checkeditems;
    var combo = $find("<%= telerikcomboboxname.ClientID%>")
     var items = combo.get_checkedItems();
      for (i = 0; i < items.length; i++) {

                            if (i == 0) {
                                radvalue = Number(parseInt(items[i]._properties._data.value));
                               checkeditems=checkeditems+radvalue ;
                            }
                            else {
                                radvalue = Number(parseInt(items[i]._properties._data.value));
                                checkeditems= checkeditems+ "," + radvalue;
                            }

                   }
                        alert(Expenseitems);
  6. Shailesh
    Shailesh avatar
    1 posts
    Member since:
    May 2017

    Posted 22 May 2017 in reply to Shinu Link to this post

    Not working for me.
  7. Arun
    Arun avatar
    3 posts
    Member since:
    Jun 2017

    Posted 07 Jun 2017 Link to this post

               function ShowEditForm(rowIndex)
                {
                     var combo = $find("<%=RadDrpListCity.ClientID%>");
                     var itm = combo.findItemByText(City.innerText);
                     itm.select();
                    var id = combo.get_selected_Item().get_value();

    not able to get the selected DataValue(not text value) of RadDropDownList. Any suggestions?? 

  8. Jeremy
    Jeremy avatar
    36 posts
    Member since:
    Apr 2014

    Posted 16 Feb 2018 in reply to Shinu Link to this post

    Shinu said:Hello,

    You could use the $find() method to get reference to AJAX control's client object.

    Here is the sample code:
    <script type="text/javascript"
        function getvalue() 
        {
            var combo = $find('<%=RadComboBox1.ClientID %>');
            alert(combo.get_selectedItem().get_value());
        
    </script>



    And for more information about client methods of RadComboBox, go through the links below:
    RadComboBox object
    RadComboBoxItemCollection object


    -Shinu.

     

    I've been trying this but get a yellow screen on 

    var combo = $find('<%=RadComboBox1.ClientID %>');

     

    I am using it in a user control, other than that I don't see what could be different.

  9. Jeremy
    Jeremy avatar
    36 posts
    Member since:
    Apr 2014

    Posted 16 Feb 2018 in reply to Jeremy Link to this post

    Jeremy said:
    Shinu said:Hello,

     

    I've been trying this but get a yellow screen on 

    var combo = $find('<%=RadComboBox1.ClientID %>');

     

    I am using it in a user control, other than that I don't see what could be different.

     

    The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.
     
    Exception Details: System.Web.HttpException: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
     
    Source Error:
     
    An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.
     
    Stack Trace:
     
     
    [HttpException (0x80004005): The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).]
       System.Web.UI.ControlCollection.AddAt(Int32 index, Control child) +9806317
       Telerik.Web.UI.RadAjaxControl.MoveUpdatePanel(Control initiator, Control updated) +142
     
    [HttpException (0x80004005): Please, see whether wrapping the code block, generating the exception, within RadCodeBlock resolves the error.]
       Telerik.Web.UI.RadAjaxControl.MoveUpdatePanel(Control initiator, Control updated) +190
       Telerik.Web.UI.RadAjaxControl.PerformRender() +403
       Telerik.Web.UI.RadAjaxControl.OnPageRender(HtmlTextWriter writer, Control page) +1187
       Telerik.Web.UI.RadAjaxControl.RenderPageInAjaxMode(HtmlTextWriter writer, Control page) +75
       System.Web.UI.Control.RenderChildrenInternal(HtmlTextWriter writer, ICollection children) +268
       System.Web.UI.Control.RenderChildren(HtmlTextWriter writer) +13
       System.Web.UI.Page.Render(HtmlTextWriter writer) +29
       System.Web.UI.Control.RenderControlInternal(HtmlTextWriter writer, ControlAdapter adapter) +66
       System.Web.UI.Control.RenderControl(HtmlTextWriter writer, ControlAdapter adapter) +100
       System.Web.UI.Control.RenderControl(HtmlTextWriter writer) +25
       System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1405
  10. Jeremy
    Jeremy avatar
    36 posts
    Member since:
    Apr 2014

    Posted 16 Feb 2018 in reply to Jeremy Link to this post

    Jeremy said:

     

    The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.
     
    Exception Details: System.Web.HttpException: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).
     
    Source Error:
     
    An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.
     
    Stack Trace:
     
     
    [HttpException (0x80004005): The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).]
       System.Web.UI.ControlCollection.AddAt(Int32 index, Control child) +9806317
       Telerik.Web.UI.RadAjaxControl.MoveUpdatePanel(Control initiator, Control updated) +142
     
    [HttpException (0x80004005): Please, see whether wrapping the code block, generating the exception, within RadCodeBlock resolves the error.]
       Telerik.Web.UI.RadAjaxControl.MoveUpdatePanel(Control initiator, Control updated) +190
       Telerik.Web.UI.RadAjaxControl.PerformRender() +403
       Telerik.Web.UI.RadAjaxControl.OnPageRender(HtmlTextWriter writer, Control page) +1187
       Telerik.Web.UI.RadAjaxControl.RenderPageInAjaxMode(HtmlTextWriter writer, Control page) +75
       System.Web.UI.Control.RenderChildrenInternal(HtmlTextWriter writer, ICollection children) +268
       System.Web.UI.Control.RenderChildren(HtmlTextWriter writer) +13
       System.Web.UI.Page.Render(HtmlTextWriter writer) +29
       System.Web.UI.Control.RenderControlInternal(HtmlTextWriter writer, ControlAdapter adapter) +66
       System.Web.UI.Control.RenderControl(HtmlTextWriter writer, ControlAdapter adapter) +100
       System.Web.UI.Control.RenderControl(HtmlTextWriter writer) +25
       System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1405

     

    I googled the error message and found one solution suggesting = to a #

            var combo1 = $find("<%= Resource1RadComboBox.ClientID %>");
    to
            var combo1 = $find("<%# Resource1RadComboBox.ClientID %>");

     

    And the yellow screen went away but combo1 is null.

  11. Peter Milchev
    Admin
    Peter Milchev avatar
    880 posts

    Posted 19 Feb 2018 Link to this post

    Hello Jeremy,

    Using a CodeBlock to surround the script tag should resolve the issue as suggested in RadAjaxPanel and "The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>). ":
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function AjaxReq(args) {
               var combo1 = $find("<%= Resource1RadComboBox.ClientID %>");
            }
        </script>
    </telerik:RadCodeBlock>


    Regards,
    Peter Milchev
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  12. Good
    Good avatar
    2 posts
    Member since:
    Jul 2017

    Posted 20 Sep 2018 Link to this post

    function OnClientSelectedIndexChanged(sender, eventArgs) {    

        var item = eventArgs.get_item();   

      var selectedVal = item.get_value();

Back to Top