??xml version="1.0" encoding="utf-8" standalone="yes"?>
1.首先需要解决的是由文本昄状态与TEXT框{换的问题.由文本显C到~辑框这个可以通过修改对应对象的innerHTML来解?q辑框切换到文本显C开始用的是outerHTML来修改的(后来发现有问?.
2.行切换的问题:当选择的行做了(jin)变换?如果数据做了(jin)更改且未提交的话仍显C未修改前的?q个在页面中加入?jin)一个隐藏域,保存选中行的数据.q部分数据只是用来(f)时保存数据的,不需要提交到后台,未包含在FORM?只是l了(jin)一个IDq行区分;
3.选中的行q不是所有字D都更改为可~辑状?只有部分字段需要更?q里在修改innerHTML的时候进行了(jin)判断;
4.如何与FORM中的属性匹配的问题:可以在修改innerHTML的时候指定name可以了(jin);
5.后来在接下来的测试中,如果字段中存在HTML字符,通过outerHTML来赋?览器会(x)对它q行解析,q不是想要显C的信息.开始查JS函数的时候发C(jin)escape?unescape,以ؓ(f)?x)进行自动{换的,后来发现q如此.在经q几番修改之?发现修改outerText属性则不会(x)对赋的D行解?
6.׃一些验证是定义在后台的,只有提交到服务器后才?x)进行校?如果(g)验不通过q返回当前页?要保留提交前的状?q里是给RadioButton一个ID(后台数据表中的主键?.扑ֈ对应的行,再把把它|成选中状?同时相应的列改ؓ(f)~辑?
7.应该说到q里基本已经完成?但在提交到服务器校验出错?q回的页面中昄的仍然是~辑前的?׃面做了(jin)h,隐藏域的值已l被重置.如果再切换到其它?昄的仍然是用户修改后的数据,q部分数据ƈ未成功更新到后台,应该昄成修改前的数?q里通过Request传回到页面中,在触发对应的RadioButton后再把D到隐藏域?
部分代码如下:
<script language="JavaScript" type="text/javascript">
//Get parent node.
window.SearchByTagName = function(e, TAG) {
while(e!=null && e.tagName){
if(e.tagName==TAG.toUpperCase()) {
return(e);
}
e = e.parentNode;
}
return null;
}
var selectedRow = -1; //global
function selectChanged(e) {
var td = SearchByTagName(e, "TD");
var tr = td.parentNode;
var tab = SearchByTagName(tr, "TABLE");
var cellValue = "";
//Reset the cell's value.
if(selectedRow>=0) {
for(var i=td.cellIndex+1; i<tab.rows[selectedRow].cells.length; i++) {
var a = tab.rows[selectedRow].cells[i].getElementsByTagName("INPUT");
for(var k=0; k<a.length; k++) {
if(a[k].type=="text") {
//Valid only in IE.
a[k].outerText = document.getElementById(a[k].name).value;
}
}
}
}
selectedRow = tr.rowIndex;
//Change the cell into text,and save the value into hidden field.
var hyoujijunCell = document.getElementById("hyoujijun" + selectedRow);
var ryakusyouCell = document.getElementById("ryakusyou" + selectedRow);
var nameCell = document.getElementById("name" + selectedRow);
document.getElementById("hyoujijun").value=rtrim(hyoujijunCell.innerText);
document.getElementById("hyoujijun" + selectedRow).innerHTML =
"<input type='text' name='hyoujijun' maxlength='3' style='width:80px' value='" +
rtrim(hyoujijunCell.innerHTML) +"'>";
document.getElementById("ryakusyou").value=rtrim(ryakusyouCell.innerText);
document.getElementById("ryakusyou" + selectedRow).innerHTML =
"<input type='text' name='ryakusyou' maxlength='4' style='width:60px' value='" +
rtrim(ryakusyouCell.innerHTML) +"'>";
document.getElementById("name").value= rtrim(nameCell.innerText);
document.getElementById("name" + selectedRow).innerHTML =
"<input name='name' maxlength='100' style='width:300px' value='" +
rtrim(nameCell.innerHTML) +"'>";
}
function validReturn() {
if ( <%=selectedMasterID%> > 0) {
//Get the selected row,and select it.
var radioSn = document.getElementById("masterid<%=selectedMasterID%>");
radioSn.click( );
//Save original value.If changed other row,restore data as before modified.
document.getElementById("hyoujijun").value = "<%=hyoujijunReturn%>";
document.getElementById("name").value = "<%=nameReturn%>";
document.getElementById("ryakusyou").value = "<%=ryakusyouReturn%>";
}
}
//Clear the last blank.
function rtrim(cellValue) {
if (cellValue.lastIndexOf(" ") >= 0) {
cellValue = cellValue.substr(0,cellValue.lastIndexOf(" "));
}
return cellValue;
}
</script>
<body class="gyomu" onload="validReturn()">
<table>
<logic:present name="masterList">
<logic:iterate id="element" indexId="index" name="masterList">
<tr>
<td class="meisai" style="width: 50px">
<logic:notEqual name="element" property="sakujyo" value="DELETE">
<input type="radio" name="masterid"
value="<bean:write name='element' property='masterid'/>"
onclick="selectChanged(this)" id="masterid<bean:write name='element' property='masterid'/>" />
<%rowCount++;%>
</logic:notEqual>
</td>
<td class="meisai" style="width: 80px" id="hyoujijun<%=index%>">
<bean:write name="element" property="hyoujijun" />
</td>
<td class="meisai" style="width: 60px" id="cd<%=index%>">
<bean:write name="element" property="cd" />
</td>
<td class="meisai" style="width: 300px" id="name<%=index%>">
<bean:write name="element" property="name" />
</td>
<logic:equal name="needShortName" value="true">
<td class="meisai" style="width: 60px" id="ryakusyou<%=index%>">
<bean:write name="element" property="ryakusyou" />
</td>
</logic:equal>
<td class="meisai" style="width: 70px" id="sakujyo<%=index%>">
<bean:write name="element" property="sakujyo" />
</td>
</tr>
</logic:iterate>
</logic:present>
</table>
</body>
pageContext
- PageContext for the tag making this call
forward
- Logical forward name for which to look up the context-relative URI (if specified)
href
- URL to be utilized unmodified (if specified)
page
- Module-relative page for which a URL should be created (if specified)
action
- Logical action name for which to look up the context-relative URI (if specified)
params
- Map of parameters to be dynamically included (if any)
anchor
- Anchor to be dynamically included (if any)
redirect
- Is this URL for a response.sendRedirect(
下面介绍一下详l的使用Ҏ(gu):
1.在JSP面中导入对应的?
<%@ page import= "org.apache.struts.util.RequestUtils"%>
?BR><%@ page import= "org.apache.struts.taglib.TagUtils"%>
2.创徏一个JAVASCRIPT函数:
<script language="JavaScript" type="text/javascript">
function search() {
<%String searchUrl = RequestUtils.computeURL(
pageContext,
null,
null,
"/Search.do",
null,
null,
null,
false);
%>
document.form1.action = "<%=searchUrl%>";
document.form1.submit();
}
</script>
3.在JSP面中给对应的表单指定ID以便上面的函数进行确定提交的是哪个FORM(如果一个页面在存在多个FORM的话):
<html:form styleId="form1" action="/aotherSearch">
.........
</html:form>
4.在需要触发提交动作的地方,调用2中的JAVASCRIPT函数:
<html:button property="searchInfo" value="(g)? onclick="search()" style="width:100px" />
对应的ACTION与FORM在配|文件中定义.q样,可以动态更改FORM的ACTION实现一个FORM对应多个ACTION?