May 2007

You are currently browsing the articles from Java Blog - Java, J2EE, SOA, Spring and Hibernate written in the month of May 2007.

Javascript Child Window invoking a parent window

Here’s on the most simplest example of demonstrating Child window to parent window communication using javascript.

The trick is in using the javascript function “parent.opener.<js method name to invoke in parent>”

Parent window HTML code

<html>
<body>
<script>
function clickme() {
winopen(’DeleteUserConfirmation.html’,'popup575×505′,
‘WIDTH=575,HEIGHT=500,RESIZABLE=No,SCROLLBARS=YES,
TOOLBAR=NO,LEFT=200,TOP=100′);
}
function winopen(url,stuff,morestuff)
{
var popwin = window.open(url,stuff,morestuff);
if( typeof(popwin) != “undefined” && popwin ) {
popwin.focus();
}
}
function forward(){
alert(’function in parent window’);
}
</script>
<a href=”javascript:clickme()”> Click for Popup Window</a>
</body>
</html>

Child window HTML code

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>

<html >
<head>
<title>Second Window</title>
</head>
<table cellpadding=”0″ cellspacing=”0″ border=”0″ width=”100%” >
<tr>
<td align=”center”>
<p> </p>
<p><B>What’s your choice?</B></p>
<p><a href=”javascript:parent.opener.forward();window.close();”><b>Call Parent Window</b></a> <a href=”javascript:window.close()”>Close me</a></p>
</td>
</tr>
</table>
</body>
</HTML>

Written by Ravi Nallakukkala on May 18th, 2007 with comments disabled.
Read more articles on Uncategorized.

Hiding dropdown using Javascript

I started working on a task where we need to display drop down based on the text selected in another drop down. The contents of the second drop down are retrieved though an AJAX call.

Here’s and example which does displays a drop down with three values Admin, Student and Teacher. on selection of a teacher, a grades drop down will be displayed.
<html>
<body>

<script TYPE=”text/javascript”>
function handleGrades(obj) {
if(obj.value== 2){
buildGradesDropDown();
document.getElementById(”GradesDropDown”).style.visibility = “visible”;
} else{
document.getElementById(”GradesDropDown”).style.visibility = “hidden”;
}
}

function buildGradesDropDown() {
var dropdown = ‘Grade : <select name=”selGradeId” id=”selGradeId” >’;
//Ajax call should be here, to retrieve the data for the dropdown
dropdown += getOption(’first’,1);
dropdown += getOption(’second’,2);
dropdown += getOption(’third’,3);
dropdown += ‘</select>’;
document.getElementById(”GradesDropDown”).innerHTML = dropdown;
//alert(document.getElementById(”GradesDropDown”).innerHTML);
}

function getOption(value,display) {
return ‘<Option value=’+value+’>’+display +’</option>’;
}
</script>

<form >
Select Role
<select name=”selSchoolId” id=”day” onchange=”handleGrades(this);”>
<option value=”1″>Admin</option>
<option value=”2″>Student</option>
<option value=”3″>Teacher</option>
</select>

<div id=”GradesDropDown” style=”visibility:hidden”>

</div>
</form>
</body>
</html>

Written by Ravi Nallakukkala on May 14th, 2007 with no comments.
Read more articles on Uncategorized.