$find(...) returns nothing

16 posts, 1 answers
  1. Mike
    Mike avatar
    26 posts
    Member since:
    Dec 2006

    Posted 03 Oct 2008 Link to this post

    Hello,
    I have a JS fuction that uses the $find function to try and get the selectedItemValue from a radCombobox, but the call returns nothing. Below is the beginning of the function. If I look at the combo var afer the '$find' call it is null

    JS Function:
    function getCounterFormat() {
    debugger
    var combo = $find("<%= DisplayCounter1.cboFormat.ClientID %>");
    var formatString;
    try{
    formatString = combo.get_value;
    ( remainder removed for brevity )

    When rendered the line looks like:
    var combo = $find("ctl00_contentRight_DisplayCounter1_cboFormat")

    in the rendered source this is the combobox id:
    <div class="ComboBox_Default" id="ctl00_contentRight_DisplayCounter1_cboFormat"

    the getCounterFormat() function is called on OnClientSelectedIndexChanged

    Just to test I created a different function:
    function setCounterFormat(obj) {
    debugger
    var formatString = obj.Value;
    var newString = getCounterFormat();

    This one does return the selecteditem value on the obj.Value call but the getCounterFormat() still returns nothing.

    Can you tell me what I am doing wrong?

  2. Rosi
    Admin
    Rosi avatar
    2527 posts

    Posted 06 Oct 2008 Link to this post

    Hi Mike,

    First, I suggest you replace the following line: formatString = combo.get_value;  with  formatString = combo.get_value();

    Then you can check when you call the getCounterFormat method. You can use the pageLoad function where $find is guaranteed to return valid object:

    function pageLoad()
    {
        var newString = getCounterFormat();
    }


    Regards,
    Rosi
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mike
    Mike avatar
    26 posts
    Member since:
    Dec 2006

    Posted 06 Oct 2008 Link to this post

    The getCounterFormat has to be called from the OnClientSelectedIndexChanged of two seperate comboboxes. When one changes I have to get the value from 2 boxes and concatenate them together for display purposes and then do some work based on the value of the 2 comboboxes.
  5. Rosi
    Admin
    Rosi avatar
    2527 posts

    Posted 06 Oct 2008 Link to this post

    Hello Mike,

    In this case modifying the code 

    formatString = combo.get_value; 
    to
    formatString = combo.get_value();


    I suggest you try this and let us known how this goes.

    Regards,
    Rosi
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Mike
    Mike avatar
    26 posts
    Member since:
    Dec 2006

    Posted 06 Oct 2008 Link to this post

    The problem is that the $find function returns null.
    so combo.getvalue() returns undefined.

    Is $find colliding with something? I also use YUI  on this page.
    What is the fully qualified name for $find?
  7. Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 06 Oct 2008 Link to this post

    Mike-

    Is getCounterFormat() called by the RadCombobox that you want to query? If it is, you can save yourself the $find statement and reference the combobox that fired the event directly, like this:

    function getCounterFormat(sender, args){
    var formatString = null;
    try{
    formatString = sender.get_value();
    ...
    }

    If you're trying to target a different combobox (i.e. one that didn't fire the OnSelectedIndexChanged event), the syntax you've shown should work (even in a YUI environment). Sometimes with JavaScript, an error elsewhere in your code can cause things to fail in weird places, though. Have you tried stepping your JavaScript code using something like Firebug in Firefox? That may help reveal what's going on.

    Let me know if that helps.

    -Todd
  8. Answer
    Rosi
    Admin
    Rosi avatar
    2527 posts

    Posted 07 Oct 2008 Link to this post

    Hi ,

    You can also use the  Telerik.Web.UI.RadComboBox.ComboBoxes array to access the combobox instances.

    For example var combo1= Telerik.Web.UI.RadComboBox.ComboBoxes[0] will return the first combobox and 

    var combo2= Telerik.Web.UI.RadComboBox.ComboBoxes[1] will return the second combobox and so on.

    For more details you can read our help article - Finding combobox on the client-side when it is embedded in another control


    Kind regards,
    Rosi
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  9. Mike
    Mike avatar
    26 posts
    Member since:
    Dec 2006

    Posted 07 Oct 2008 Link to this post

    Thank you very much. That was one small detail I left out :-( it is indeed embedded in another control.
  10. Gabriel
    Gabriel avatar
    3 posts
    Member since:
    Feb 2008

    Posted 25 Mar 2009 Link to this post

    I am having the same problem but with a RadDateTimePicker control.  After reading up on $find() here, it seems that it uses the id that is passed in as a key in a key value "array": Sys.Application._component.  When I look at the DOM for the Telerik website i can see the Rad controls have been registered in this array so a $find() operation would work.  For my website, however, the RAD controls are not getting registered in Sys.Application._component, so $find() operations do not work.  Why is this the case?  Is there another way I can access the Rad objects (not the HTML elements) without using $find() and without hard-coding id values?  (I would rather not have to register the controls manually either.  It seems like i must be missing something if they are getting registered automatically.)
    thx for any help.

    thx,
    gabe
    function RestrictedBeginDateTime_DateSelected(sender, args) { 
        var dateTime = args.NewDate; 
        var jqEndPicker = $('.rdtpEnd :first:input'); 
        var id = jqEndPicker.attr('id'); // this is the ClientID
        var radEndPicker = $find(id); // this return null
        radEndPicker.set_minDate(dateTime); // this fails of course because radEndPicker is null
  11. Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 25 Mar 2009 Link to this post

    I imagine the problem could be that you're not getting the right ID with your JQ search. What ID value are you passing to the $find() method? If you can share that it will quickly reveal if you're using the correct client-side ID to target the RadControl object.

    Also, for debugging, you might try something like this just to see if your code works:

    var radEndPicker = $find('<%= myRadDatePicker.ClientID %>');

    This will guarantee that you're using the correct client-side ID and it will be a good way to determine if the ID is the problem. Give that a try and let me know how it goes.

    -Todd
  12. Gabriel
    Gabriel avatar
    3 posts
    Member since:
    Feb 2008

    Posted 25 Mar 2009 Link to this post

    i have already used the VS08 c# debugger to check the ClientID of the control i'm trying to find and compared that w/ the id that i see when i use FireBug to check the value of the 'id' variable that is being passed into the $find() and they are identical.  I know for sure that's not the problem.  Also, i used FireBug to examine the Sys.Application._component object and it has no properties, so I am assuming that means none of the RadControl objects are getting registered w/ the Sys.Application._component object automatically.  This is the real problem.  I was able to access the Rad object by using the following:

    function RestrictedBeginDateTime_DateSelected(sender, args) { 
        var dateTime = args.NewDate; 
        var jqEndPicker = $('.rdtpEnd :first:input'); 
        var id = jqEndPicker.attr('id'); // gets the ClientID (identical w/ what the VS08 debugger tells me)
        var radEndPicker = $find(id); // currently, always returns null
        if (!radEndPicker) { 
            radEndPicker = window[id]; // gets the Rad object
        } 
        radEndPicker.SetMinDate(dateTime); 

    This is my workaround for now until I can get these Rad objects to be registered w/ the Sys.Application._component object automatically.

    thx,
    gabe

    P.S.
    I am using external javascript files, and i have never been able to get <%= control.ClientID %> to work in external files.



  13. Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 25 Mar 2009 Link to this post

    Correct, you cannot use server tags in external JS files. In those cases, it is best to pass-in the ID of the control via an "init" constuctor. For instance, on your parent page you may have code like this:

    initScriptControlIds('<%= myRadControl1.ClientID %>', '<%= myRadControl2.ClientID %>');

    And then, in your external JS file, you'd have something like this:

    var ctl1 = null;
    var ctl2 = null;
    function initScriptControlIds(control1, control2){
    ctl1 = control1;
    ctl2 = control2;
    }

    Back to the main issue- it is very strange that $find() is not working for you. For further debugging, try writing some simple code in your client-side pageLoad event to see if $find() works there. For instance, write something like this:

    function pageLoad(){
    var dp = $find('<%= radEndPicker.ClientID %>');
    if(dp == null) alert('Control not found.');
    }

    That will help further determine if the problem is with the page or with timing. Let me know how your tests go. If you are unable to access the control, even on pageLoad, then I suggest you open a support ticket and attach a simple page that demonstrates the problem. From there, I can take a look at your code and try to help further.

    Hope that helps.

    -Todd
  14. Gabriel
    Gabriel avatar
    3 posts
    Member since:
    Feb 2008

    Posted 27 Mar 2009 Link to this post

    @Todd:

    thanks for the tip on initializing the ClientIDs! 8o)

    I don't think that it's a timing issue because this is a client event that gets fired when the user has selected a date/time in a DateTimePicker.  The page should be way past loading by this time i would think.  I'll try the pageLoad though.

    thx,
    gabe
  15. Todd Anglin
    Todd Anglin avatar
    2040 posts
    Member since:
    Aug 2005

    Posted 27 Mar 2009 Link to this post

    Yes, I agree- it's probably not a timing issue. Tesing with pageLoad, though, will simplfy the scneario and help us discover if we can get to a point where the $find() code works (as it should). If that works, then we can work back towards your event code in the external JS file. I look forward to the results of your tests.

    -Todd
  16. Avishek
    Avishek avatar
    3 posts
    Member since:
    Jan 2011

    Posted 18 Apr 2011 Link to this post

    Hi,
    I have a specific requirement with RadComboBox. I have implemented it with asp dropdownlist, but I am not able to do it with RadComboBox...The requirement is whenever the selected value for any of the dropdown is "others", I need to make one textbox visible, which is just next to the dropdown.

    html part

    <

     

     

    asp:DropDownList ID="ddlTitle" runat="server">

     

     

    </

     

     

    asp:DropDownList>

     

     

    <

     

     

    asp:TextBox ID="txtTitleOthers" runat="server" class="textBox hide" />

    Javascript Code written inside $(document).ready

     

     

     

     

     

     

     

     

    $(

     

     

    'select').change(function () {

     

     

     

     

     

    //alert('changed');

     

     

     

     

     

     

     

     

     

     

     

    var others_option = $('option:selected', this).val();

     

     

     

     

     

    if ((others_option) == 'others') {

     

     

    $(

     

     

    this).next().removeClass('hide');

     

     

    }

     

     

     

     

    else {

     

     

    $(

     

     

    this).next().addClass('hide');

     

     

    }

     

    });

    The same thing obviously does not work with Rad ComboBox. I have tried in several ways, but couldn't make it. Can Somebody help...

  17. Helen
    Admin
    Helen avatar
    1052 posts

    Posted 21 Apr 2011 Link to this post

    Hi Avishek,

    Please find below a sample how to achieve this with RadComboBox.:

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadComboBox ID="RadComboBox1" runat="server" OnClientSelectedIndexChanged="clientChanged">
    <Items>
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem1"
        Value="RadComboBoxItem1" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem2"
        Value="RadComboBoxItem2" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem3"
        Value="RadComboBoxItem3" />
        <telerik:RadComboBoxItem runat="server" Text="others" Value="others" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem5"
        Value="RadComboBoxItem5" />
        <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem6"
        Value="RadComboBoxItem6" />
    </Items>
    </telerik:RadComboBox>
       
    <asp:TextBox ID="txtTitleOthers" runat="server" class="textBox hide" />
    <script type="text/javascript">
        var $ = $telerik.$;
     
        function clientChanged(sender, args)
        {
            var others_option = args.get_item().get_value();
            if ((others_option) == 'others') {
     
            $('#txtTitleOthers').removeClass('hide');
     
            }
            else {
     
                $('#txtTitleOthers').addClass('hide');
        
                }
        }
    </script>

    Hope it helps.

    Regards,
    Helen
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017