input not being drawn

This may or may not be a problem with ActiveWidgets, but I dont know. If anyone can point me to my problem I'd appreciate it. What I am trying to do is create a simple login window. The first time I run the code below its displays fine. But after hiding the entire object box and then running the code again the txtPassword input box doesnt get drawn.

The function displayDialogBox is what is displaying the box. If that code is needed please let me know, but all I am doing is writing the string 'data' to a box and setting the display style to block.

data = "<p>Please enter your username and password to login.</p>";
    data += "<p><span class=\"txtLabel\">Username:</span><span id=\"txtUsername\"></span></p>";
    data += "<p><span class=\"txtLabel\">Password:</span><span id=\"txtPassword\"></span></p>";
    data += "<p class=\"pButton\"><span id=\"btnLogin\"></span></p>";
    displayDialogBox(1, data, "Login", 300);
    
    txtPassword.refresh();
    txtUsername.refresh();
    btnLogin.refresh();
    
    txtUsername.focus();
    txtPassword.setControlText("");
 

???
<script>
var data = "<p>Please enter your username and password to login.</p>"; 
    data += "<p><span class=\"txtLabel\">Username:</span>";
    data += "<span id=\"txtUsername\"></span></p>"; 
    data += "<p><span class=\"txtLabel\">Password:</span>";
    data += "<span id=\"txtPassword\"></span></p>"; 
    data += "<p class=\"pButton\"><span id=\"btnLogin\"></span></p>"; 
    data += "<p class=\"pButton\"><span id=\"btnLoginAG\"></span></p>"; 

function displayDialogBox(firstParam, BodySpans , Size){
document.write(BodySpans);
}

    displayDialogBox(1, data, "Login", 300); 
     
     var txtUsername = new AW.UI.Input;
     txtUsername.setId('txtUsername');

     var txtPassword = new AW.UI.Input;
     txtPassword.setId('txtPassword');
     
     var btnLogin = new AW.UI.Button;
     btnLogin.setId('btnLogin');
    btnLogin.setControlText("OK");
    
    btnLogin.onControlClicked = function(){ 
    txtUsername.setStyle('display','none')
    txtPassword.setStyle('display','none')
    this.setStyle('display','none')
    btnLoginAgain.setStyle('display','block')
     }
     
          var btnLoginAgain = new AW.UI.Button;
     btnLoginAgain.setId('btnLoginAG');
    btnLoginAgain.setControlText("Login");
    btnLoginAgain.setStyle('display','none');
    
    btnLoginAgain.onControlClicked = function(){ 
    txtUsername.setStyle('display','block')
    txtPassword.setStyle('display','block')
    btnLogin.setStyle('display','block')
    this.setStyle('display','none')
     }

    txtUsername.refresh();   
    txtPassword.refresh(); 
    btnLogin.refresh(); 
     
    txtUsername.focus(); 
    txtPassword.setControlText(""); 
 
</script> 

Your code works fine for me - everything is normal (IE7, quirks doctype). The problem might be because you are setting the 'display' attribute to 'block' instead of its original value (inline or inline-block on IE and -moz-inline-box on Firefox). Better solution would be using a class -

.aw-hidden-true {
display: none!important;
}

obj.setClass('hidden', true);
obj.setClass('hidden', false);