2012-04-29 193 views
0

我在ASP/VBScript中创建了一个动态表格,用于填充记录集中的表格。使用DO LOOP为每个新的EmployeeID创建一个新行。下拉列表有2个选项:“签入”和“签出”。如果选择“签入”,则评论框将保持禁用状态,如果选择“签出”项目,评论框将被启用;这两个选项都会在选中时生成一个日期。每行有1个下拉列表的动态表格(经典ASP [VBScript]和JavaScript)

问题是该下拉列表仅适用于第一行。

我知道我需要重写代码,所以每次有新行时它都会调用test()函数。

那么有什么办法可以克隆函数并让它对每一行都执行?我已经尝试通过添加一个rowCount到他们的ID名称来动态添加一个rowCount(例如:“id =”TestCmt <%= rowTest%>)

也许有人可以指出我正确的方向?我已经在这花了几个小时,我想弄明白(有点)我自己:)

下面是一些代码:

<html xmlns:ntb> 
<head> 
    <script language="javascript" type="text/javascript"> 

    function enable() { 
    document.getElementById("TestCmt").readOnly = false; 
    document.getElementById("TestCmt").style.backgroundColor = "#FFFFFF"; 
    document.getElementById("TestCmt").innerHTML = ""; 
    document.getElementById("TestCmt").style.color = "#000000"; 
    } 

    function disable() { 
    document.getElementById("TestCmt").readOnly = true; 
    document.getElementById("TestCmt").style.backgroundColor = "#DCDCDC"; 
    document.getElementById("TestCmt").innerHTML = ""; 
    } 

    function test() { 
    <% if (StoreID > 0) AND (rsTest.bof=FALSE) then %> //Make sure there are employees 

    var selectMenuT = document.getElementById("TestStatus"); 
    selectMenuT.onchange = function() { 

    var chosenOptionT = parseInt(this.options[this.selectedIndex].value); 
    var textDateT = document.getElementById("TestDate"); 
    var cmtsT = document.getElementById("TestCmt"); 


    switch (chosenOptionL) { 

    case 0: 
    disable(); 
    textDateT.innerHTML = ""; 
    cmtsT.innerHTML = <%=rsTest("TestCmt")%> 
    break; 

    case 1: 
    disable(); 
    var approve = getReviewDate(); //excluded this function from here but it works fine 
    textDateT.innerHTML = approve; 
    break; 

    case 2: 
    enable(); 
    var reject = getReviewDate(); 
    textDateL.innerHTML = reject; 
    break; 
    } 
    } 
    <% end if %> 
    } 
    </script> 
</head> 

<body> 

<% if (StoreID > 0) and rsTest.BOF=FALSE then %> 

<span class="header">Test Playground - Store# <%=rsStore("StoreNo")%></span> 

<table class="table" name="StoreTable" cellpadding="1" cellspacing="0"> 
    <tr> 
    <td class="TestHeader">Store No.</td> 
    <td class="TestHeader">Check-In Status</td> 
    <td class="TestHeader">Date</td> 
    <td class="TestHeader">Comments</td> 
</tr> 

<%   
    dim i3, iStr3 
    dim rowTest 
    rowTest = 0 

    do until rsTest.EOF 
    i3=clng(rsTest("EmployeeID")) 
    iStr3=right("000"+cstr(i3),4) 
    rowTest = rowTest + 1 
%> 

<tr> 
    <!-- Store No.--> 
    <td> 
    <% if StoreID > 0 then %> 
    <label id="TestRN<%=rowTest%>"></label> 
    </td> 

    <!-- Check-In Status--> 
    <td class="TestData" valign="top"> 
    <select id="TestStatus<%=rowTest%>" style="width:100%" **onchange="test()"**> 
     <option value="0">&lt;Select one&gt;</option> 
     <option value="1">Check-In</option> 
     <option value="2">Check-Out</option> 
    </select> 
    </td> 

    <!--Date--> 
    <td valign="top"> 
    <input type="hidden" name="Sequence<%=iStr3%>" id="Sequence<%=iStr3%>"> 
    <label ID="TestDate<%=rowTest%>" class="TestData"><%=rowTest%></label> 
    </td> 

    <!--Comments--> 
    <td valign="middle"> 
    <textarea id="TestCmt<%=rowTest%>" rows="2" style="textarea" ReadOnly ></textarea> 
    </td> 
    <% end if %> 
</tr> 

<% 
rsTest.MoveNext 
loop 
%> 

</table> 
<% end if %> 

</body> 
</html> 

任何帮助表示赞赏。

签名:学习菜鸟

回答

0

感谢您的帮助。

我最终将<%= rowTest%>计数器放在了我的每个ID和函数名中。这又为每个行ID生成一个test()函数(例如“test_1()”,“test_2()”)。

实施例:

function test()_<%=rowTest%> { 
... 
} 

... 
<select id="TestStatus<%=rowTest%>" style="width:100%" onchange="test()_<%=rowTest%>"> 
    <option value="0">&lt;Select one&gt;</option> 
    <option value="1">Check-In</option> 
    <option value="2">Check-Out</option> 
</select> 
0

只需添加一个参数传递给javascript函数,从中可以看到其下拉菜单已经改变。

例如:

function test(elem) { 
    // elem is the dom element (the select) 
    // get selected value: 
    switch(elem.value) { 

    } 
} 

<select id="TestStatus<%=rowTest%>" style="width:100%" onchange="test(this)"> 
</select>