flickering input textbox

Question

4.00/5 (1 vote)

See more:

Hey Guys,
I am working on a bug causing a flickering input box. The page is dynamically created, and I noticed when you start typing in the empty box the text will be flickering as you type and when you delete the content of the box then whatever you type won't be displayed unless you go to different box and click back to the box and you will see the text.

I noticed when the page is created if I set the content to none empty( I tried ) then the problem goes away. Basically, the textbox does not like to be empty!!!

Update1:
Browser Type: IE
The input box is part of a table and the content is filled with the following code:

C#

function enableDesignMode(rte, html, readOnly)
{
    var frameHtml

    if (fnSetContent.html == null)fnSetContent.html = new Array();
    fnSetContent.html[rte] = [html, readOnly];

    if(html.length == 0 )
    {
        frameHtml = '&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;';
        frameHtml += "&lt;html id=\"" + rte + "\"&gt;\n";
        frameHtml += "&lt;html&gt;\n&lt;head&gt;\n";

        //to reference your stylesheet, set href property below to your stylesheet path and uncomment
        if (cssFile.length &gt; 0)
        {
            frameHtml += "&lt;link media=\"all\" type=\"text/css\" href=\"" + cssFile + "\" rel=\"stylesheet\"&gt;\n";
        }
        else
        {
            frameHtml += "&lt;style&gt;\n";
            frameHtml += "body {\n";
            frameHtml += "  background: #FFFFFF;\n";
            frameHtml += "  margin: 0px;\n";
            frameHtml += "  padding: 0px;\n";
            frameHtml += "  font-family: Tahoma, Verdana, Arial;\n";
            frameHtml += "  font-size: 80%;\n";
            frameHtml += "}\n";
            frameHtml += "&lt;/style&gt;\n";
        }

        frameHtml += "&lt;/head&gt;\n";
        frameHtml += "&lt;body&gt;\n";
        frameHtml += html + "\n";
        frameHtml += "&lt;/body&gt;\n";
        frameHtml += "&lt;/html&gt;";

    }
    else
        frameHtml = html;

C#

if (document.all)
    {
//      if (fnSetContent.html == null)fnSetContent.html = new Array();
//      fnSetContent.html[rte] = [frameHtml, readOnly];
        if (fnSetContent.html != null)
        {
            fnSetContent.html[rte][0] = frameHtml;
            fnSetContent.html[rte][1] = readOnly;
        }
        var oRTE = frames[rte].document;
        if (frames[rte].ready)
        {
            oRTE.open();
            oRTE.write(frameHtml);
            oRTE.close();
        }
        rteCommand(rte, "fontsize", "2");
        oRTE.onselectionchange = new Function("updateFont('" + rte + "');");
        oRTE.onkeyup = new Function("handleFont('" + rte + "');");
        if(frameHtml.indexOf("STYLE") == -1)
        {
        setTimeout("setEditorStyles('" + rte + "');", 10);
        }
    }
    else
    {

...
then some other work is done
}

...
where the 'html' is the content of the input box...when it is empty the if part get executed which causes the flickering problem!!!

update2:
*** I noticed in one of the pages, removing DTD will fix the issue, but then the text box shows undefined.(update)getting undefined was my fault, and not the result of removing DTD, so never mind this...

update3:
Removing the url part will fix flickering issue and the text box does not get initialized with undefined
Now, I am wondering what will be consequences if one omits the url field in a doctype tag?

original:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

modified:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Posted 6-Jun-12 11:13am

soby

Updated 12-Jun-12 8:19am

v11

Add a Solution

Comments

Stephen Hewison 6-Jun-12 17:31pm

Can you post a basic example showing this behaviour and explain which browser you are using?

TRK3 6-Jun-12 17:34pm

It might be help if you posted the relevant code.

Stephen Hewison 8-Jun-12 19:16pm

Question? Have you used the developer tools in the browser and set break points throughout your code? My best guess at this point is that one of the events your code is utilising is creating a loop causing the content to be repeatedly applied.

Sergey Alexandrovich Kryukov 11-Jun-12 15:00pm

Please use "Improve question" above and add your new question about doctype; instead of re-posting.
--SA

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

soby · Accepted Answer · 2012-06-12T08:23:00

Solution 1

So, I ended up removing Doctype tag which fixed ( or masked :) ) the issue...but I think the actual problem was call to validation which probably was somehow in loop, so I will investigate that later and post updates.

Posted 12-Jun-12 8:23am

soby

Updated 12-Jun-12 8:24am

v2