membuat pop up window sederhana menggunakan javascript | java php laravel linux mysql sql bootstrap html css query java php laravel linux mysql sql bootstrap html css query: membuat pop up window sederhana menggunakan javascript

Monday, July 16, 2012

membuat pop up window sederhana menggunakan javascript

pop up window mengirim object dari child ke parent

q> File popup1.html (sebagai parent)
[sourcecode language="html"]

<HTML><BODY>
<SCRIPT LANGUAGE="JavaScript">
function buka(){
window.open('popup2.html','','width=640,height=480,menubar=yes,location=yes,scrollbars=yes,resizeable=yes,status=yes,copyhistiry=ho,toolbar=no')
}
</SCRIPT>
</BODY>
<FORM name="formname">
<table>
<tr>
<td>Id Kecamatan</td><td>:</td><td><INPUT TYPE="text" NAME="id_kec"></td><td><input type="submit" value="LOV" onclick="buka()"></td>
</tr>
<tr>
<td>Nama Kecamatan</td><td>:</td><td><INPUT TYPE="text" NAME="nama_kec"></td><td>&nbsp;</td>
</tr>
</FORM>
</HTML>
[/sourcecode]



q> File popup2.html (sebagai child)

[sourcecode language="html"]
<HTML>
<head>
<script language="javascript">

function addRowHandlers() {
var table = document.getElementById("tableId");
var rows = table.getElementsByTagName("tr");
for (i = 0; i < rows.length; i++) {
var currentRow = table.rows[i];
var createClickHandler =
function(row)
{
return function() {
var cell = row.getElementsByTagName("td")[0];
var cell2 = row.getElementsByTagName("td")[1];
var kolom1 = cell.innerHTML;
var kolom2 = cell2.innerHTML;
opener.document.formname.id_kec.value=kolom1;
opener.document.formname.nama_kec.value=kolom2;
window.close();
};
};

currentRow.onclick = createClickHandler(currentRow);
}
}
</script>
</head>
<BODY onload="addRowHandlers()">
Master Kecamatan
<table id="tableId">
<tr bgcolor="cccccc"><td>DS</td><td>Daha Selatan</td></tr>
<tr><td>DU</td><td>Daha Utara</td></tr>
<tr bgcolor="cccccc"><td>DB</td><td>Daha Barat</td></tr>
<tr><td>PB</td><td>Padang Batung</td></tr>
<tr bgcolor="cccccc"><td>AG</td><td>Angkinang</td></tr>
<tr><td>SI</td><td>Simpur</td></tr>
<tr bgcolor="cccccc"><td>TL</td><td>Telaga Langsat</td></tr>
<tr><td>KD</td><td>Kandangan</td></tr>
</table>
</BODY>
</HTML>
[/sourcecode]

No comments:

Post a Comment

saifiahmada.com adalah blog belajar programming Indonesia, membahas lengkap materi bahasa pemrograman: code HTML, CSS, Bootstrap, Desain, PHP, MySQL, coding Java, Query, SQL, dan dunia linux