Question

当您单击“添加新项”按钮时，我有一些动态添加行/字段的Javascript。每行的值都在隐藏文本字段“txtIndex”中捕获。（txtIndex的初始值设置为1.）然后我在vbscript中的变量中捕获txtIndex以循环遍历值，以便它们可以全部插入到SQL表中（插入在存储过程中完成，“spInsert” ）。这是我遇到麻烦的部分。

页面上的第一行很好地插入到SQL表中，但当我单击按钮并添加任何后续行时，这些值不会插入到表中;相反，插入一个空行。所以，这不是SQL问题。从我查看页面源时可以看到的情况来看，页面没有意识到我已经添加了任何新的行/值。所以，我猜我的Javascript中的某些内容已关闭？谁能告诉我我做错了什么以及如何纠正它？谢谢！

<!--#includes file="header.asp"-->

<head>
<title>Offset Input</title>
</head>

<%Dim CN, RS, vIndex, vSQL

'GetDataConnection is included in header file.
Set CN = GetDataConnection

If Request.TotalBytes > 0 Then
    vIndex = Request.Form("txtIndex")

    If Request.Form("cboOffsetGroupOperator") = "" Then
        Response.Write("Unable to process your request. Please complete a new entry.")
        Response.Redirect("input.asp")  
    Else                
        'Loop through values in txtIndex.  Insert data into table.
        Do While vIndex > 0 
            vSQL = "spInsert "
            vSQL = vSQL & "@vExceptionID = " & RS("ExceptionID") & ","
            vSQL = vSQL & "@vOffsetDetailCorrectionOperator = '" & Request.Form("cboOffsetGroupOperator" & vIndex) & "',"
            vSQL = vSQL & "@vOffsetDetailNumberOfItems  = '" & Request.Form("txtNumberOfItems" & vIndex) & "',"
            vSQL = vSQL & "@vOffsetDetailComments  = '" & Request.Form("txtComments" & vIndex) & "'"

            CN.Execute (vSQL)       
            vIndex = vIndex-1       
        Loop    
    End If
Else%>

<body>
<form name="frmInput" id="Input" method="post">
<table class="WebApps" id="tblOffsetDetail">
<tbody>
    <tr>
        <td colspan="3">
            <h3>Offset Item Detail</h3> 
            <p><input name="btnSubmit" type="submit" class="button" id="btnSubmit" value="Submit"></p>
        </td>
    </tr>
    <tr>
        <td colspan="3">    
        <input type="button" class="button" value= "Add New Item" id="btnNewItem" name="btnNewItem" onClick="javascript:addNewItem();">
        <input type="hidden" id="txtIndex" name="txtIndex" value="1">
        </td>
    </tr>
    <tr>
        <td width="9%"><h4>Operator:</h4></td>
        <td width="6%"><h4># of Items:</h4></td>
        <td width="13%"><h4>Comments:</h4></td>
    </tr>
    <tr>
        <td>
            <p><select name="cboOffsetGroupOperator1" id="cboOffsetGroupOperator1">
                <option></option>
                <option value="1">Name1</option>
                <option value="2">Name2</option>
                <option value="3">Name3</option>
                <option value="4">Name4</option>
            </select></p>
        </td>
        <td><p><input name="txtNumberofItems1" type="text" id="txtNumberofItems1" size="10" maxlength="10"></p></td>
        <td><p><textarea name="txtComments1" cols="20" rows="3" id="txtComments1"></textarea></p></td>
    </tr>
</tbody>
</table>
</form>

<% 
End If

Set RS = Nothing
CN.Close
Set CN = Nothing
%>

<script language="javascript">

//Display additional rows, columns, and fields when Add New Item button is clicked.
function addNewItem()
{
    var iX = document.getElementById("txtIndex").value;
    iX ++;
    document.getElementById("txtIndex").value = iX;

    var tbl = document.getElementById("tblOffsetDetail").getElementsByTagName("TBODY")[0];
    var tr = document.createElement("TR");
    tbl.appendChild(tr);

    //cboOffsetGroupOperator1
    var tdOffsetGroupOperator = document.createElement("TD");
    tr.appendChild(tdOffsetGroupOperator);

    var p = document.createElement("P");
    tdOffsetGroupOperator.appendChild(p);

    var cboOffsetGroupOperator = document.createElement("select"); 
    p.appendChild(cboOffsetGroupOperator);

    cboOffsetGroupOperator.id = "cboOffsetGroupOperator" + iX;

    var cboOffsetGroupOperator1 = document.getElementById("cboOffsetGroupOperator1");
    var i = 0;

    for (i = 0; i < cboOffsetGroupOperator1.children.length; i++)
        {
            var opt = document.createElement("option");
            opt.value = cboOffsetGroupOperator1 [i].value;
            opt.innerText = cboOffsetGroupOperator1 [i].innerText;
            cboOffsetGroupOperator.appendChild(opt);
        }   

    //txtNumberofItems1
    var tdNumberofItems = document.createElement("TD");
    tr.appendChild(tdNumberofItems);

    var p = document.createElement("P");
    tdNumberofItems.appendChild(p);

    var txtNumberofItems = document.createElement("input"); 
    p.appendChild(txtNumberofItems);

    txtNumberofItems.id = "txtNumberofItems" + iX;
    txtNumberofItems.setAttribute('size',10);

    var txtNumberofItems1 = document.getElementById("txtNumberofItems1");

    //txtComments1
    var tdComments = document.createElement("TD");
    tr.appendChild(tdComments);

    var p = document.createElement("P");
    tdComments.appendChild(p);

    var txtComments = document.createElement("textarea"); 
    p.appendChild(txtComments);

    txtComments.id = "txtComments" + iX;
    txtComments.setAttribute('cols',20);
    txtComments.setAttribute('rows',3);

    var txtComments1 = document.getElementById("txtComments1"); 
}
</script>

</body>
</html>

Answer 1

这种JavaScript代码可以用于学习基本DOM和数据库驱动的Web应用程序如何工作，但如果您打算让人们使用此应用程序，您必须清理所有JavaScript代码，因为它不适用于所有浏览器。帮自己一个忙，选择一个像jQuery这样简单但功能强大的库。

同时查看MVC framework并将您的数据库代码与视图分开，并在两端验证您的输入。

同样关注SQL注入问题。

祝你好运。

Answer 2

您添加到DOM的表单元素没有名称。在表单提交中使用这些名称之前，您需要为它们指定名称。

var cboOffsetGroupOperator = document.createElement("select"); 
cboOffsetGroupOperator.setAttribute('name', 'cboOffsetGroupOperator1'); // this is what you're missing
p.appendChild(cboOffsetGroupOperator);

并且，正如SQLMenace所说，请修复您在那里的SQL注入问题...开始时，将以下文本放入详细注释字段并提交。

abc';创建表bork（a varchar（30））;插入bork值（'all 你的基地属于我们'）; -

但是，我建议您注意答案，说明您的JavaScript不能跨浏览器工作。看起来你需要深入研究一下，以使你的代码真正正确。

在SQL插入中未捕获DHTML行值

2 个答案: