Making a dynamic window with form input by javascript
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Student Admission</title>
<script language="javascript">
function dyn_window(){
var title="My Title";
var name=document.f.txtName.value;
var address=document.f.txtAddress.value;
var course=document.f.txtCourse.value;
var sex="";
var subject="";
//check if radio button is selected and read selected value
for (i=0;i<document.f.rdoSex.length;i++) {
if (document.f.rdoSex[i].checked) {
sex = document.f.rdoSex[i].value;
}
}
for(j=0;j<document.f.chkSubject.length;j++){
if (document.f.chkSubject[j].checked) {
subject+=document.f.chkSubject[j].value+", ";
}
}
// create new window here
a=open('','','width=200,height=200')
with(a.document){
write("<html>");
write("<head><title>"+title+"</title></head>");
write("<body>");
write("<div style='border:1px solid gray'>Name:"+name+"<br/><img src='2736.jpg' /><br/>");
write("Address:"+address+"<br/>");
write("Course:"+course+"<br/>");
write("Sex:"+sex+"<br/>");
write("Subject:"+subject+"<br/></div>");
write("<input type='button' value='Close me' onclick='self.close();' />");
write("<input type='button' value='Print' onclick='self.print();' />");
write("</body>");
write("</html>");
}
}// end the function
</script>
</head>
<body>
<form action="#" method="post" name="f" style="width:200px; margin:0px auto; border:1px solid gray; padding:10px">
<div>Name<br/>
<input type="text" name="txtName" />
</div>
<div>Address<br/>
<textarea name="txtAddress" ></textarea>
</div>
<div>Course<br/>
<select name="txtCourse" >
<option value="MBA">MBA</option>
<option value="BBA">BBA</option>
<option value="CIS">CIS</option>
<option value="EEE">EEE</option>
</select>
</div>
<div>Sex<br/>
Male<input type="radio" name="rdoSex" value="Male" />
Female<input type="radio" name="rdoSex" value="Female" />
</div>
<div>Subject<br/>
English<input type="checkbox" value="English" name="chkSubject" />
Bengali<input type="checkbox" value="Bengali" name="chkSubject" />
</div>
<div>
<input type="button" onclick="dyn_window()" value="Submit" />
</div>
</form>
</body>
</html>
Comments 0