刷新并填充动态添加的行
我有一个按钮,按下该按钮后,将添加一个新的 HTML 行。这些行中有两个组合框:cboOffsetGroup 和 cboOffsetType。根据 cboOffsetGroup 中的选择,cboOffsetType 的选项将会改变。我使用 JavaScript 中的refreshPage() 函数来执行此操作。它在第一行中工作正常,但在随后添加的行中,我无法弄清楚如何调用refreshPage()函数,以便我可以填充cboOffsetType的适当选项。对此的任何帮助表示赞赏。请注意,我在这方面几乎是新手,并且意识到这可能不是最好的代码,但这是我必须使用的代码。谢谢!
<%
Dim CN, RS, vIndexOffset, vOffsetGroup
Set CN = GetDataConnection
vIndexOffset = Request.Form("txtOffsetIndex")
%>
<body>
<form name="frmExceptionInput" id="frmExceptionInput" method="post">
<input type="hidden" name="txtAction" id="txtAction" value="">
<table width="50%" id="tblOffsetDetail">
<tbody>
<tr>
<td colspan="2">
<input type="button" class="button" value= "Add New Item" id="btnNewOffsetItem" name="btnNewOffsetItem" onClick="javascript:addNewOffsetItem();">
<input type="hidden" id="txtOffsetIndex" name="txtOffsetIndex" value="1">
</td>
</tr>
<tr>
<td>
<p>
<select name="cboOffsetGroup1" id="cboOffsetGroup1" onChange="refreshPage();">
<option value="0"></option>
<%
Set RS = CN.Execute ("spSelectGroup")
If Not RS.EOF Then
Do While Not RS.EOF
%>
<option value='<%= RS("offsetGroupID")%>'<%If RS("offsetGroupID") = Request.Form("cboOffsetGroup" & vIndexOffset) Then Response.Write " selected"%>><%= RS("offsetGroup")%></option>
<%
'Get next record
RS.MoveNext
Loop
End If
%>
</select>
</p>
</td>
<td>
<p>
<select name="cboOffsetType1" id="cboOffsetType1">
<%
'If the user changes the combo box selected, set vOffsetGroup = the value selected by the user on the page.
If Request.Form("txtAction") = "Change Selection" Then
vOffsetGroup = Request.Form("cboOffsetGroup" & vIndexOffset)
End If
%>
<option value="0"></option>
<%
Set RS = CN.Execute ("spSelectType @vOffsetGroup='" & vOffsetGroup & "'")
If Not RS.EOF Then
Do While Not RS.EOF
%>
<option value='<%= RS("offsetItemTypeID")%>'<%If Request.Form("cboOffsetType1") = RS("offsetItemTypeID") Then Response.Write "selected"%>><%= RS("offsetItemType")%></option>
<%
'Get next record
RS.MoveNext
Loop
End If
%>
</select>
</p>
</td>
</tr>
</tbody>
</table>
</form>
</body>
<script language="javascript">
function refreshPage()
{
var refreshPage = document.getElementById("frmExceptionInput");
//If this function is called, the value of txtAction will become "Change Selection."
document.getElementById("txtAction").value = "Change Selection";
refreshPage.submit();
}
//Display additional rows.
function addNewOffsetItem()
{
var iX = document.getElementById("txtOffsetIndex").value;
iX ++;
document.getElementById("txtOffsetIndex").value = iX;
var tbl = document.getElementById("tblOffsetDetail").getElementsByTagName("TBODY")[0];
var tr = document.createElement("TR");
tbl.appendChild(tr);
//cboOffsetGroup1
var tdOffsetGroup = document.createElement("TD");
tr.appendChild(tdOffsetGroup);
var p = document.createElement("P");
tdOffsetGroup.appendChild(p);
var cboOffsetGroup = document.createElement("select");
p.appendChild(cboOffsetGroup);
cboOffsetGroup.id = "cboOffsetGroup" + iX;
cboOffsetGroup.setAttribute('name','cboOffsetGroup' + iX);
var cboOffsetGroup1 = document.getElementById("cboOffsetGroup1");
var i = 0;
for (i = 0; i < cboOffsetGroup1.children.length; i++)
{
var opt = document.createElement("option");
opt.value = cboOffsetGroup1 [i].value;
opt.innerText = cboOffsetGroup1 [i].innerText;
cboOffsetGroup.appendChild(opt);
}
//cboOffsetType1
var tdOffsetType = document.createElement("TD");
tr.appendChild(tdOffsetType);
var p = document.createElement("P");
tdOffsetType.appendChild(p);
var cboOffsetType = document.createElement("select");
p.appendChild(cboOffsetType);
cboOffsetType.id = "cboOffsetType" + iX;
cboOffsetType.setAttribute('name','cboOffsetType' + iX);
var cboOffsetType1 = document.getElementById("cboOffsetType1");
var i = 0;
for (i = 0; i < cboOffsetType1.children.length; i++)
{
var opt = document.createElement("option");
opt.value = cboOffsetType1 [i].value;
opt.innerText = cboOffsetType1 [i].innerText;
cboOffsetType.appendChild(opt);
}
}
</script>
</html>
I have a button that, when pressed, will add a new HTML row. Within these rows are two combo boxes: cboOffsetGroup and cboOffsetType. Depending on what is selected in cboOffsetGroup, the options for cboOffsetType will change. I do this using a refreshPage() function in Javascript. It works fine in the first row, but in the subsequently added rows, I cannot figure out how to call the refreshPage() funciton so that I can populate the appropriate options for cboOffsetType. Any help on this is appreciated. Note that I'm pretty much a novice at this, and realize this may not be the best code, but it's what I have to work with. Thanks!
<%
Dim CN, RS, vIndexOffset, vOffsetGroup
Set CN = GetDataConnection
vIndexOffset = Request.Form("txtOffsetIndex")
%>
<body>
<form name="frmExceptionInput" id="frmExceptionInput" method="post">
<input type="hidden" name="txtAction" id="txtAction" value="">
<table width="50%" id="tblOffsetDetail">
<tbody>
<tr>
<td colspan="2">
<input type="button" class="button" value= "Add New Item" id="btnNewOffsetItem" name="btnNewOffsetItem" onClick="javascript:addNewOffsetItem();">
<input type="hidden" id="txtOffsetIndex" name="txtOffsetIndex" value="1">
</td>
</tr>
<tr>
<td>
<p>
<select name="cboOffsetGroup1" id="cboOffsetGroup1" onChange="refreshPage();">
<option value="0"></option>
<%
Set RS = CN.Execute ("spSelectGroup")
If Not RS.EOF Then
Do While Not RS.EOF
%>
<option value='<%= RS("offsetGroupID")%>'<%If RS("offsetGroupID") = Request.Form("cboOffsetGroup" & vIndexOffset) Then Response.Write " selected"%>><%= RS("offsetGroup")%></option>
<%
'Get next record
RS.MoveNext
Loop
End If
%>
</select>
</p>
</td>
<td>
<p>
<select name="cboOffsetType1" id="cboOffsetType1">
<%
'If the user changes the combo box selected, set vOffsetGroup = the value selected by the user on the page.
If Request.Form("txtAction") = "Change Selection" Then
vOffsetGroup = Request.Form("cboOffsetGroup" & vIndexOffset)
End If
%>
<option value="0"></option>
<%
Set RS = CN.Execute ("spSelectType @vOffsetGroup='" & vOffsetGroup & "'")
If Not RS.EOF Then
Do While Not RS.EOF
%>
<option value='<%= RS("offsetItemTypeID")%>'<%If Request.Form("cboOffsetType1") = RS("offsetItemTypeID") Then Response.Write "selected"%>><%= RS("offsetItemType")%></option>
<%
'Get next record
RS.MoveNext
Loop
End If
%>
</select>
</p>
</td>
</tr>
</tbody>
</table>
</form>
</body>
<script language="javascript">
function refreshPage()
{
var refreshPage = document.getElementById("frmExceptionInput");
//If this function is called, the value of txtAction will become "Change Selection."
document.getElementById("txtAction").value = "Change Selection";
refreshPage.submit();
}
//Display additional rows.
function addNewOffsetItem()
{
var iX = document.getElementById("txtOffsetIndex").value;
iX ++;
document.getElementById("txtOffsetIndex").value = iX;
var tbl = document.getElementById("tblOffsetDetail").getElementsByTagName("TBODY")[0];
var tr = document.createElement("TR");
tbl.appendChild(tr);
//cboOffsetGroup1
var tdOffsetGroup = document.createElement("TD");
tr.appendChild(tdOffsetGroup);
var p = document.createElement("P");
tdOffsetGroup.appendChild(p);
var cboOffsetGroup = document.createElement("select");
p.appendChild(cboOffsetGroup);
cboOffsetGroup.id = "cboOffsetGroup" + iX;
cboOffsetGroup.setAttribute('name','cboOffsetGroup' + iX);
var cboOffsetGroup1 = document.getElementById("cboOffsetGroup1");
var i = 0;
for (i = 0; i < cboOffsetGroup1.children.length; i++)
{
var opt = document.createElement("option");
opt.value = cboOffsetGroup1 [i].value;
opt.innerText = cboOffsetGroup1 [i].innerText;
cboOffsetGroup.appendChild(opt);
}
//cboOffsetType1
var tdOffsetType = document.createElement("TD");
tr.appendChild(tdOffsetType);
var p = document.createElement("P");
tdOffsetType.appendChild(p);
var cboOffsetType = document.createElement("select");
p.appendChild(cboOffsetType);
cboOffsetType.id = "cboOffsetType" + iX;
cboOffsetType.setAttribute('name','cboOffsetType' + iX);
var cboOffsetType1 = document.getElementById("cboOffsetType1");
var i = 0;
for (i = 0; i < cboOffsetType1.children.length; i++)
{
var opt = document.createElement("option");
opt.value = cboOffsetType1 [i].value;
opt.innerText = cboOffsetType1 [i].innerText;
cboOffsetType.appendChild(opt);
}
}
</script>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您最好使用 JQuery 来完成此类任务。
http://api.jquery.com/add/
You're better of using JQuery for this sort of task.
http://api.jquery.com/add/