combo box is getting vanished when an alert is coming
In my jsp page i have one text box and two combo box. An alert is coming in my jsp page when i am writing something in the textbox. Alert is coming as "username already exists" and after alert that textbox is autorefreshed but two combo boxes are getting vanished why? i could not find out what may be the reason any help please? I included the following in head section. Full source for alert is here.
http://csscody.com/demo/wp-content/demo/popup/js/jquery.easing.1.3.js
http://csscody.com/demo/wp-content/demo/popup/js/alertbox.js
http://csscody.com/demo/wp-content/demo/popup/js/style.css
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<SCRIPT type="text/javascript" src="js/jquery.min.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/jquery.easing.1.3.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/alertbox.js"></SCRIPT>
<LINK rel="stylesheet" type="text/css" media="all" href="js/style.css">
<script type="text/javascript">
$(document).ready(function() {
$("#textbox").keyup(function () {
$.getJSON('check.jsp', {
textboxname: this.value
},function(data){
if(data.isTrue){
$("#textbox").val(''); //clear the text box
csscody.alert("username already exists");// here alert is coming
}
else{
}
});
});
});
</script>
</head>
<body>
<input type="text" id="textbox" name="textboxname" style="position: absolute; width: 250px; left: 110px; top: 40px;" />
<br/><br/>
// The following two combo boxes are getting vanished after alert why
<select id="" name="" style="position: absolute; left: 600px; top: 40px; width: 250px;">
<option value=""></option>
<option value="somedata">somedata</option>
</select>
<br/><br/>
<select id="" >
<option value="_"></option>
<option value="somedata">somedata</option>
</select>
</body>
</html>
check.jsp
JSONObject jsonObj= new JSONObject();
jsonObj.put("isTrue","true");
response.setContentType("application/json");
response.getWriter().write(jsonObj.toString());
Solution 1:
Its all ok with your code. When i started debug you code i saw some interesting thing in alertbox.js: (line 141 and 178)
if (!$.support.maxHeight) { //IE6
$('embed, object, select').css({ 'visibility' : 'hidden' });
}
This code detect ie6(if read a comment) but seems its buggy.
Just comment these lines and your problem will be solved.
And don't forgot to post this bug! Good luck. And start use debugger :)
Solution 2:
following code will solve your problem,
csscody.alert("username already exists",{ onComplete: function(){
$('embed, object, select').css({ 'visibility' : 'visible' });
}
});