2014年11月30日 星期日
struts2 + jquery ajax 簡單範例
使用版本:
jquery-1.8.2.min.js
struts2-core-2.1.8.1.jar
struts2-json-plugin-2.1.8.1.jar
JSP:
<select id="itemList" name="itemList" onchange="changeItem()">
<option value="0">請選擇</option>
<option value="1">apple</option>
<option value="2">banana</option>
<option value="3">orange</option>
<option value="4">peach</option>
</select>
<br/>
項目名稱:<input type="text" id="itemName" name="itemName" />
Javascript:
<script type="text/javascript" src="js/jquery/jquery-1.8.2.min.js"></script>
<script language="JavaScript" type="text/javascript">
function changeItem() {
var itemVal = $("#itemList").val();
var data = {"itemVal" : itemVal};
$.ajax({
url:'index!queryItemList',
type:'POST',
data: data,
dataType:'json',
success:function (data) {
// alert(JSON.stringify(data));
$("#itemName").val(data.itemName);
}
});
}
</script>
struts.xml:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.1.7//EN"
"http://struts.apache.org/dtds/struts-2.1.7.dtd">
<struts>
<package name="prcdefault" extends="json-default">
<action name="index" class="com.prc.action.IndexAction">
<result name="success">/pages/success.jsp</result>
<result name="jsonResult" type="json"></result>
</action>
</package>
</struts>
Action:
private String itemVal;
private String itemName;
public String getItemVal() {
return itemVal;
}
public void setItemVal(String itemVal) {
this.itemVal = itemVal;
}
public String getItemName() {
return itemName;
}
public void setItemName(String itemName) {
this.itemName = itemName;
}
public String queryItemList() {
if("1".equals(itemVal)) {
itemName = "apple";
} else if("2".equals(itemVal)) {
itemName = "banana";
} else if("3".equals(itemVal)) {
itemName = "orange";
} else if("4".equals(itemVal)) {
itemName = "peach";
} else {
itemName = "none";
}
return "jsonResult";
}
2014年11月28日 星期五
html 父網頁 子網頁溝通
1.子視窗傳值至母視窗
<script language=javascript>
function name(name) {
var name;
window.opener.document.getElementById('school_name').value = name;
}
</script>
2.子視窗傳值呼叫母視窗函式
<script language=javascript>
function name(name) {
window.opener.outside(name);//標紅字體則為母視窗的javascript的函式
}
</script>
------------------------------------------------------------------------------------------------
testopener.html:
<script language="JavaScript" type="text/javascript">
var subwinId;
function openTest() {
subwinId = window.open('testSub.html?msg=hi');
}
function sendValueToParent() {
var s = subwinId.document.getElementById("submsg");
s.innerHTML = "Done!";
}
function reloadSubWindow() {
subwinId.reloadSubWindow();
}
function closeSubWindow() {
subwinId.close();
}
</script>
</head>
<body >
<input type="button" id="checkButton" value="送出" onclick="openTest()">
<br/>
<input type="button" id="sendButton" value="送值給子視窗" onclick="sendValueToParent()">
<br/>
<input type="button" id="sendButton" value="reload子視窗" onclick="reloadSubWindow()">
<br/>
<input type="button" id="sendButton" value="關閉子視窗" onclick="closeSubWindow()">
<br/>
回傳值:<div id="parentMessageId"></div>
</body>
<script language=javascript>
function name(name) {
var name;
window.opener.document.getElementById('school_name').value = name;
}
</script>
2.子視窗傳值呼叫母視窗函式
<script language=javascript>
function name(name) {
window.opener.outside(name);//標紅字體則為母視窗的javascript的函式
}
</script>
------------------------------------------------------------------------------------------------
testopener.html:
<script language="JavaScript" type="text/javascript">
var subwinId;
function openTest() {
subwinId = window.open('testSub.html?msg=hi');
}
function sendValueToParent() {
var s = subwinId.document.getElementById("submsg");
s.innerHTML = "Done!";
}
function reloadSubWindow() {
subwinId.reloadSubWindow();
}
function closeSubWindow() {
subwinId.close();
}
</script>
</head>
<body >
<input type="button" id="checkButton" value="送出" onclick="openTest()">
<br/>
<input type="button" id="sendButton" value="送值給子視窗" onclick="sendValueToParent()">
<br/>
<input type="button" id="sendButton" value="reload子視窗" onclick="reloadSubWindow()">
<br/>
<input type="button" id="sendButton" value="關閉子視窗" onclick="closeSubWindow()">
<br/>
回傳值:<div id="parentMessageId"></div>
</body>
testSub.html:
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
var msg = Request["msg"];
$("#submsg").text(msg);
alert("reloadSubWindow");
});
var url=location.search;
var Request = new Object();
if(url.indexOf("?")!=-1)
{
var str = url.substr(1) //去掉?號
strs = str.split("&");
for(var i=0;i<strs.length;i++)
{
Request[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
}
function reloadSubWindow(){
location.reload();
}
</script>
</head>
<body >
<div id="submsg"></div>
</body>
參考網址:
http://tc.wangchao.net.cn/bbs/detail_553964.html
http://crazy.molerat.net/learner/cpuroom/homepage/reading.php?filename=97102215523.dov
訂閱:
文章 (Atom)