Question

I have one combo box which displays a text box when 2nd or 3rd option is selected, but how to hide that text box when first option is selected?

$("#combo").change(function () {
        $.getJSON('combo.jsp', {
            comboname: this.value
        }, function (data) {
            if(data.isTrue){
            $("#textbox").empty().append("<input type='text' id='text1'/>");// display an empty text box
                   }
                   else{
                       // how to clear that text box and hide it?
                   }
        });
    });

html

<select id="combo" name="comboname">
<option value="_"></option>// how to clear and hide the text box when this option is  
  selected?
<option value="somevalue">somename</option>// when this option is selected then it 
 displays an empty text box
<option value="somevalue1">somename1</option>when this option is selected then it also 
 displays the same empty text box
</select>
// in the following div, text box is being displayed
<div id="textbox">
// here text box is displayed when option 2nd or 3rd is selected from the above combo
</div>

server side (combo.jsp)

JSONObject jsonObj= new JSONObject(); 
 jsonObj.put("isTrue","true");
response.setContentType("application/json");
response.getWriter().write(jsonObj.toString());

Answer 1

Do you really need server side? Here an example without:

$("#combo").change(function () {
    if (this.value != '_') {  
        $("#textbox").empty().append("<input type='text' id='text1'/>");
    }
    else {
        $("#textbox").hide();
    }
});

Also see this example.

But if really need server side, you have to set isTrue conditionally.