如何使用Ajax而不是文本框更新标签？

Question

I'm using ajax to update a textbox once the value in a drop down box has been selected. However, i only update/put text in it if certain conditions are met, so it looks rubbish when there is no message. I was thinking that having a label there would be much better, but is this possible? Can i have an empty label and just update the label text when needed?

Cheers leddy

Edit:

I'm using php and when the drop down box is selected, I am querying a mysql db (in the reports.php page) - depending on what the result of that is, decides whether i update the textbox or not:

function getHTTPObject(){
   if (window.ActiveXObject) return new ActiveXObject("Microsoft.XMLHTTP");
   else if (window.XMLHttpRequest) return new XMLHttpRequest();
   else {
      alert("Your browser does not support AJAX.");
      return null;
   }
}   

// Change the value of the outputText field
function setOutput(){
    if(httpObject.readyState == 4){
        document.getElementById('outputText').value = httpObject.responseText;
    }

}


function checkException()
{

    httpObject = getHTTPObject();
    if (httpObject != null)
    {   
        httpObject.open("GET", "reports.php?exceptions="
                        +document.getElementById('exceptionsID').value+"&date1=" + document.getElementById('date1').value, true);
        httpObject.send(null);
        httpObject.onreadystatechange = setOutput;
    }
}

var httpObject = null;

the textbox is 'outputText' and is set in the setOutput() function

Hope this explains a little better

Cheers

Answer 1

Something like this should change the text of the label.

// Change the value of the outputText field
function setOutput(){
        if(httpObject.readyState == 4){
                document.getElementById('outputText').innerHTML= httpObject.responseText;
        }

}

I updated my original post to reflect the code that was provided. This assumes that you are using the <label> , <div> , or <span> tags

Answer 2

Change the textbox into a span, and keep the id the same. Then change the code to set the innerHTML instead of the value:

// Change the value of the outputText field
function setOutput(){
        if(httpObject.readyState == 4){
                document.getElementById('outputText').innerHTML= httpObject.responseText;
        }

}

Answer 3

Assuming you're using ASP.NET, yes you can. Using the Text property of the label.

Answer 4

The simplest way to handle this without a textbox is to create a SPAN tag, give it an id of "outputText", and then change the innerText of the SPAN like this:

function setOutput() {
   if(httpObject.readyState == 4) {
       document.getElementById('outputText').innerText = httpObject.responseText;
   }
}

Inside your HTML, you'll have your label defined like this:

<span id="outputText">Some default text here</span>

Of course, some CSS styling of the SPAN might be a good thing, but that's another matter for another time. Depending on your layout needs, a DIV tag may be better than a SPAN.