19-2 使用???iframe ???步?輸

ƹWADPBǿ骺\AëD@wa AJAX ӹFCp`Npϥæ iframe 覡ӹF\C

Aڭ̥ݤ@ӽdҡG

Example]ajax/asyncViaIFrame01.htm^G

bWzdҤAAIuܤlT...vAN|ݨATwgܦbWApUG

ӳoӹL{èSgѺӹFCdҪlXpUG

lɡ]ajax/asyncViaIFrame01.htm^G]ǦϰUYi^
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>ϥ iframe ӶiDPBǿ骺²d</h2>
<hr>

<script>
// ܱqA^ǪTAƥu|QêlҩIsC
function showRetrievedInfo(serverName, serverUrl, serverIp) {
	document.getElementById('show01').innerHTML=serverName;		//  serverName
	document.getElementById('show02').innerHTML=serverUrl;		//  serverUrl
	document.getElementById('show03').innerHTML=serverIp;		//  serverIp
//	document.getElementById('myHiddenFrame').src='';		// M iframe }
}

// 檺^ơAuQIsC
function mainCallBack(){
	var iframe = document.getElementById('myHiddenFrame');	// o iframe 
	iframe.src = "serverAction01.asp";	// ]w iframe } serverAction01.asp ð榹 asp 
}
</script>

<input type="button" value="ܤlT..." onClick="mainCallBack()">
<p>lAW١G<div id="show01"></div>
<p>l}G<div id="show02"></div>
<p>lA IPG<div id="show03"></div>

<iframe id="myHiddenFrame" style="display:none"></iframe>

</body>
</html>

bWzlXݡAڭ̥iHݨ@ê iframeG

<iframe id="myHiddenFrame" style="display:none"></iframe> oê iframe NOڭ̰ЦA{XBCKAڭ̱NdҺ٬uvAӱN iframe Ұ檺٬ulvAѩ iframe OêAҥHlGä|ܥXӡCӺiDPBǿ骺u@y{pUG
  1. ϥΪIuܤlT...vAs|Is mainCallBack()AH]w iframe serverAction01.aspAyܻAɦAN| serverAction01.aspAlXpUG

    lɡ]ajax/serverAction01.asp^G]ǦϰUYi^
    <%@language=jscript%>
    <%//Ωäl{XAtd ServerVariables%>
    <%
    // iAݪB
    serverName=Request.ServerVariables("SERVER_NAME");
    serverUrl = Request.ServerVariables("URL");
    serverIp = Request.ServerVariables("LOCAL_ADDR");
    %>
    <script>
    // Is showRetrievedInfo()AHKbܬT
    window.parent.showRetrievedInfo('<%=serverName%>', '<%=serverUrl%>', '<%=serverIp%>');
    </script>
    

    ASP {X|]w serverName]lAW١^BserverUrl]l}^BserverIp]lA IP^TܼƪȡAñNȰes JavaScript window.parent.showRetrievedInfo()C

  2. æ iframe A^ǪƫAsN| window.parent.showRetrievedInfo()AYIs showRetrievedInfo()C
  3. showRetrievedInfo()AñNGܩA䤤 document.getElementById('show01').innerHTML=serverName; \ON id show01 󪺤eJ serverName ܼƪȡAyܻA <div id="show01"></div> N|QN <div id="show01">neural.cs.nthu.edu.tw</div> ]ӧڭ̴NiHߨݨѦA^ǪW١A̦C
ϥ iframe ӶiDPBǿAO@²i檺覡AHI@ΡCOk̤jIAOlLk䴩 post ƶǰe覡AYnѨMoӰDAiHϥΫp`ҭn AJAX kӹFC

bUoӽdҤAڭ̻pϥkAӹƮwidߡAåHDPB覡NdߵGܩP@ӺCѩUFd߮ɡAlo SQL OAڭ̬Oĥ get 覡ӱN SQL OǰeܤlCdҦpUG

Example]ajax/asyncViaIFrame02.asp^G

bWzdҤAڭ̥CXƮw ajax/basketball.mdb eA@]tӸƪAOO Player M TeamCڭ̥iHbrJ SQL OANiHQæ iframe 覡ܸƮwdߵGAӤgѺӹF\CҦpAYڭ̪IuidߡvAұo쪺GpUG

dҥlXpUG

lɡ]ajax/asyncViaIFrame02.asp^G]ǦϰUYi^
<%@ language="jscript" %>
<% title="ϥ iframe ӶiDPBǿ骺idҡGƮwd" %>
<!--#include file="../head.inc"-->
<hr>

<script>
// ܱqA^ǪTAƥu|QêlҩIsC
function showQueryResult(result){
	document.getElementById('showSqlResult').innerHTML=result;	// ܬdߵG
}

// 檺^ơAuQIsC
function sendQuery(){
	var sqlCommand = document.getElementById('sqlCommand');
	var sql=sqlCommand.value;
	var iframe = document.getElementById('hiddenIFrame');	// o iframe 
	iframe.src = "serverAction02.asp?sql="+escape(sql);	// ]w iframe }A䤤 sql gL escape() ƪsX
}
</script>

<script language=jscript runat=server src=sqlUtility.fun></script>
<% database = "basketball.mdb"; %>
Ʈw㤺eG
<center>
<table border=1>
<tr>
<th colspan=2 align=center>
Ʈw "<%=database%>"
<tr>
<td align=center> ƪ "Player" e
<td align=center> ƪ "Team" e
<tr>
<td> <%=getQueryResult(database, "select * from Player")%>
<td> <%=getQueryResult(database, "select * from Team")%>
</table>
</center>
<p>
пJASQLOG<br>
<input id=sqlCommand size=80 type=text value="SELECT * FROM Player WHERE Name LIKE '%'"><br>
<input type="button" value="id" onClick="sendQuery()">
<p>
dߵGG<div id="showSqlResult"></div>

<iframe id="hiddenIFrame" style="display:none"></iframe>

<hr>
<!--#include file="../foot.inc"-->

bdҤAЯSO`NIG

ӤllXpUG

lɡ]ajax/serverAction02.asp^G]ǦϰUYi^
<%@language=jscript%>
<%//Ωäl{XAtdd߸Ʈw%>
<script language=jscript runat=server src=sqlUtility.fun></script>
<%
database="basketball.mdb";
sql=Request("sql")+"";
if (sql.search(/select/i)<0)	// ˬdO_H select }Y
	outStr="<font color=red>SQL command not started with SELECT is disabled!</font>";
else 
	outStr=getQueryResult(database, sql);
%>
<script>
// Is showQueryResult()AHKbܬT
window.parent.showQueryResult('<%=outStr%>');
</script>

ѩڭ̤ƱϥΪ̥hקƮwA]ڭ̷|ϥγqιB⦡ˬd SQL OAYOH "select" }YAh{wOXk SQL Oæ^ĵiTuSQL command not started with SELECT is disabled!vC


JScript {]pPΡGΩAݪ ASP