Dynamic tooltip content not updating in IE

4 posts, 0 answers
  1. Nik
    Nik avatar
    51 posts
    Member since:
    Sep 2009

    Posted 21 Sep 2011 Link to this post

    I have a tooltip that I am using to preview text on all of a customers items in one spot. When an item is added or modified it calls a function that builds the basic html content for the tooltip, like so...(some lines omitted for clarity)

    var divReviewAllPers = getElementId('divReviewAllPers');
    for
    (i = 1; i < arrItems.length; i++) {
                strAllPersText += '<u>Item #' + i + '</u><br />';
                if (i == parseInt(hidItemEdit.value)) {
                    // This is the item being edited, so update the master string with the textbox values
                    var strNewPersTextItem = '';
                    var strItemLines = arrItems[i];
                    
                    for (x = 0; x < arrLines.length; x++) {
                        if (x < getElementId('hidNumLines').value) {
                            if (strLine == '') {
                                strAllPersText += 'Line ' + (x + 1) + ' - [LINE IS BLANK]<br />';
                            } else {
                                strAllPersText += 'Line ' + (x + 1) + ' - ' + strLine + '<br />';
                            }
                        }
                        strNewPersTextItem += 'Line ' + (x + 1) + ' - [LINE IS BLANK]<br />';
                    }
                } else {
                    // This is not the item being edited, so put the existing data back in the master string
                    if (arrItems[i].length > 0) {
                        for (y = 0; y < arrLines.length; y++) {
                            if (y < getElementId('hidNumLines').value) {
                                if (arrLines[y] == '') {
                                    strAllPersText += 'Line ' + (y + 1) + ' - [LINE IS BLANK]<br />';
                                } else {
                                    strAllPersText += 'Line ' + (y + 1) + ' - ' + arrLines[y] + '<br />';
                                }
                            }
                        }
                    }
                }
            }
             
            if (intMode == 1) {
                strNewPersTextItem = '<u>Item #' + i + '</u><br />' + strNewPersTextItem;
                divReviewAllPers.innerHTML = strAllPersText + strNewPersTextItem;
                divReviewAllPers2.innerHTML = strAllPersText + strNewPersTextItem;
            } else {
                divReviewAllPers.innerHTML = strAllPersText;
                divReviewAllPers2.innerHTML = strAllPersText;
            }

    Now, this all works fine and dandy in FF, but in IE there's a glitch. It appears to only display the content that was there the FIRST time the tooltip was activated. Once you look at the tooltip once, the content doesnt change. When tracing thru the code, I can clearly see the new content in divReviewAllPers.innerHTML, but it doesnt appear when I trigger the tooltip.
    Another twist to this is that in IE, the content DOES update if you're updating a line that was there the first time you looked at the tooltip. ie: item 1, line 1 gets updated to say "test"..."test" will show in the dropdown, but the other items that were added & edited after the first tooltip activation still do not appear. Spooky??

    Here is my tooltip html...
    <center>
                                        <a href="#" id="lnkReviewAllPers" class="link-color">Click here to review all personalization text</a>
                                        </center>
                                        <rad:RadToolTip ID="RadToolTip7" Skin="Default" runat="server" TargetControlID="lnkReviewAllPers" ShowEvent="OnClick"
                                            IsClientID="true" RelativeTo="Element" Position="BottomCenter" Width="400px" Height="225px" Animation="Fade" ManualClose="true">
                                            <div id="divReviewAllPers" style="height:215px; overflow:auto;"></div>
                                        </rad:RadToolTip>

    In the attached screenshot, you can see item #5 has been added, but it does not appear in the tooltip. Can someone advise why this might not be updating in IE?
  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 23 Sep 2011 Link to this post

    Hello Nik,

    With the provided information I cannot tell what the reason for this behavior can be. I do not even see an event attached to the RadToolTip where you call a custom function to change the content (note that this should be the OnClientShow event, at earliest, as the UI is not created before that). What I can advise at this point is that you
    1) make sure that there are no JavaScript errors under IE, as you may have hit some browser quirk, or an error may be thrown by another script in the page.
    2) upgrade to the latest version of the controls, as it seems that you are using a version that is 3 years old and many fixes and improvements have been applied during this time.


    All the best,
    Marin
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Nik
    Nik avatar
    51 posts
    Member since:
    Sep 2009

    Posted 23 Sep 2011 Link to this post

    Thanks for the reply. The function that updates the content is not triggered by the tooltip event, but by other events on the page (ie: clicking prev/next or save). So, the content is constantly updating, and the only event the tooltip is linked to is the clicking of the link to show the content. 1) I did not receive any error alerts at all in IE both when running it straight, and when debugging it line by line in visual studio. 2) As much as I'd like to, we simply don't have the ability to upgrade and QA the entire site with our current staffing.
  5. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 26 Sep 2011 Link to this post

    Hi Nik,

    I cannot say what the reason for this is and the only other option I can think of is the set_text() method of the RadTooltip - try using this instead of placing the text in a div directly. I cannot guarantee if it will work, yet there are no other methods for setting content in a tooltip.


    Greetings,
    Marin
    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
Back to Top